jQ选择元素的方法：find()

太过爱你忘了你带给我的痛 2023-06-30 02:27 56阅读 0赞

<!DOCTYPE html>
    <html lang="en">
    
    <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <meta http-equiv="X-UA-Compatible" content="ie=edge">
      <title>温故而知新</title>
      <style></style>
    </head>
    
    <body>
      <div class="test">
        <ul>
          <li>1</li>
          <li>2</li>
          <li>3</li>
        </ul>
      </div>
    </body>
    
    <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
    
    <script>
      // $(".test").css({color : '#ff0000'})
      // $(".test ul").css({listStyle : "none"})
      // $(".test ul li").css({display: "block", margin : "20px"})
    
      //通过find可以更加简便的实现上面的效果：
      $(".test")
        .css({ color: '#ff0000' })
          .find("ul")
            .css({ listStyle: "none" })
              .find("li")
                .css({ display: "block", margin: "20px" })
      
      //下面的这三个打印，主要是为了体现出来prevObject
      console.log( $(".test") )
      console.log( $(".test").find("ul") )
      console.log( $(".test").find("ul").find("li") )
    
      /*
        注意：
          $(test").find("ul").find("li").prevObject == $(".test").find("ul")
        返回的是false
        分析：
          它们的内容是一样的，但是jQ是分别构造出它们来的，所以不相等。
      */
      console.log(  $(".test").find("ul").find("li").prevObject == $(".test").find("ul") )
      
      
    </script>
    
    </html>

发表评论取消回复

表情：

评论列表（有 0 条评论，56人围观）

还没有评论，来说两句吧...

相关阅读

相关 JQ选择器

//获取到同级span的html var hongbao; hongbao = $("label[for='bonus"+val+"']

红太狼/ 2024年02月17日 22:48/ 0 赞/ 67 阅读

相关 jQ选择元素的方法：find()

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">

太过爱你忘了你带给我的痛/ 2023年06月30日 02:27/ 0 赞/ 57 阅读

相关 JQ选择器（常用的）

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">

比眉伴天荒/ 2023年06月29日 10:49/ 0 赞/ 52 阅读

相关 JavaWeb (三) Jquery ：概述、jq核心函数、与dom对象的区别、jq选择器、元素筛选

个人博客网：[https://wushaopei.github.io/][https_wushaopei.github.io] (你想要这里多有) 1、概述

深藏阁楼爱情的钟/ 2023年06月29日 05:52/ 0 赞/ 59 阅读

相关 jq的父子节点选择

一、获取父节点、祖先节点： 1. parents(\[selector\]) 本方法用于选择给定 jQuery 对象中包含的 DOM 元素或者 DOM 元素集的祖先节点，并

系统管理员/ 2023年06月25日 06:10/ 0 赞/ 60 阅读

相关 jQuery 子元素选择器 find() 和 children()

在前面的文章中多次提到了子元素和直接子元素，本篇文章来说明这两者的区别。 <div id="list"> <div name="a">

Love The Way You Lie/ 2022年05月12日 06:50/ 0 赞/ 365 阅读

相关 jq常用的几个判断元素的方法

// 判断是否隐藏显示 $("div").is(":hidden"); $("div").is(":visible") //判断元素

本是古典何须时尚/ 2022年04月17日 20:49/ 0 赞/ 226 阅读

相关 jq 获取元素宽高的方法补充

1、$对象.width/height("npx/n%"); 等同于$.css('width','npx'); 既可设置，也可获取,无单位，内容区域 2、.c

本是古典何须时尚/ 2021年07月24日 16:47/ 0 赞/ 456 阅读

相关 jq 操作元素样式

返回css样式内容对象数组.css("样式名") function t2() { var showdiv=

短命女/ 2021年07月24日 14:35/ 0 赞/ 509 阅读

相关 jq 选择器

jQuery选择器返回的是数组对象 .val() 是数组对象的方法，其他对象无法使用，直接使用返回数组中对一个对象的value

以你之姓@/ 2021年07月24日 14:01/ 0 赞/ 464 阅读