1、查找子元素方式1:>

例如:var aNods = $("ul > a");查找ul下的所有a标签

2、查找子元素方式2:children()

3、查找子元素方式3:find()

这里再简单介绍以下children()和find()的异同:

1> children及find方法都用是用来获得element的子elements的,两者都不会返回 text node,就像大多数的jQuery方法一样。 
2> children方法获得的仅仅是元素一下级的子元素,即:immediate children。 
3> find方法获得所有下级元素,即:descendants of these elements in the DOM tree 
4> children方法的参数selector 是可选的(optionally),用来过滤子元素,

但find方法的参数selector方法是必选的。 
5> find方法事实上可以通过使用 jQuery( selector, context )来实现。即$('li.item-ii').find('li')等同于$('li', 'li.item-ii').

例:

<ul class="level-1">
<li class="item-i">I</li>
<li class="item-ii">II
<ul class="level-2">
<li class="item-a">A</li>
<li class="item-b">B
<ul class="level-3">
<li class="item-1">1</li>
<li class="item-2">2</li>
<li class="item-3">3</li>
</ul>
</li>
<li class="item-c">C</li>
</ul>
</li>
<li class="item-iii">III</li>
</ul>

使用:

$('ul.level-2').children().css('border', '1px solid green'); 

的效果是:

使用 $('ul.level-2').find('li').css('border', '1px solid green'); 的效果是:

Jquery-获取子元素children,find的更多相关文章

  1. jquery获取子元素

    Jquery获取子元素的方法有2种,分别是children()方法和find()方法. 下面我们分别来使用这两种方法,看看它们有何差异. children()方法:获取该元素下的直接子集元素 find ...

  2. jQuery获取子元素个数的方法

    //获取id=div1下的子元素的个数 $('#id').children().length; //获取id=div1下的p元素个数 $('#id').children('p').length;

  3. jQuery获取子元素的个数

    一.获取div下的子元素的个数 $("div").children().length; 二.获取div下的span子元素的个数 $("div").childre ...

  4. jquery 获取子元素的限制jquery

    今天练习jqueryAPI发现一个问题就是子元素如果采用nth-child,元素不同就获取不到,因此一个父元素下的子元素标签必须相同,如果不同第一个元素可以用这个方法实现,但是如果第二元素及以后如果出 ...

  5. js和jquery获取子元素

    <ul id="nav"> <li></li> <li> <ul> <li></li> < ...

  6. js与jquery获取父元素,删除子元素的不同方法

    var obj=document.getElementById("id");得到的是dom对象,对该对象进行操作的时候使用js方法 var obj=$("#id" ...

  7. 获取子元素节点(children,childNodes)

    在js中获取元素节点有DOM对应的方法如getElementsByTagName()等等..对于获取子元素还有另外一种获取方法ChildNodes 不过ChidNodes在高级浏览器除(IE6-8)里 ...

  8. 原生js获取子元素

    感谢原文作者:归一山人 原文链接:https://www.cnblogs.com/guiyishanren/p/12214757.html 获取子元素的方法有 //获取第一个demo类 dom = d ...

  9. jquery获取当前元素的坐标

    jquery获取当前元素的坐标 1,获取对象 var obj = $("#id号"); 或  var obj = $(this); 实例中我获取的对象是弹出窗口按钮,这样创建的新窗 ...

  10. 使用jquery获取父元素或父节点的方法

    今天面试题问到了,没答上,jq要继续学习啊 jquery获取父元素方法比较多,比如parent(),parents(),closest()这些都能帮你实现查找父元素或节点,下面我们来一一讲解: 先举个 ...

随机推荐

  1. 【ASP.NET 类库】当你懒得用 Json+Ajax 时,可以试试 AjaxPro

    一般我们在页面调用Ajax时,需要通过 js 调用ajax ,接着后台处理得到的数据,然后返回数据,ajax 得到返回的数据进行处理. 然而有没有可以像调用方法一样来进行Ajax操作呢? AjaxPr ...

  2. 深度优先搜索 codevs 1031 质数环

    codevs 1031 质数环  时间限制: 1 s  空间限制: 128000 KB  题目等级 : 黄金 Gold   题目描述 Description 一个大小为N(N<=17)的质数环是 ...

  3. codeforces 712A A. Memory and Crow(水题)

    题目链接: A. Memory and Crow time limit per test 2 seconds memory limit per test 256 megabytes input sta ...

  4. 请叫我机智-巧用ios朗读kindle图书

    想必大家都有想过kindle出中文的有声阅读刊物吧? 今天突发奇想想到一招能够让我们听自己拿kindle买的中文图书.当然这是有条件的. 前提是你得有一个ios设备,不管是iphone还是ipad,i ...

  5. uGUI练习(九) Toggle Button

    练习目标 练习单选框,多选框 Toggle Group:Toggle容器 Toggle:单一的选项 练习步骤 1.创建一个Panel,命名TogglePanel,添加Toggle Group组件,可以 ...

  6. SVN--分支、合并

    首先说下为什么我们需要用到分支-合并.比如项目demo下有两个小组,svn下有一个trunk版.由于客户需求突然变化,导致项目需要做较大改动,此时项目组决定由小组1继续完成原来正进行到一半的工作[某个 ...

  7. 用CSS3实现上下左右箭头

    225deg 向上箭头 135deg向下箭头45deg向右箭头 -45deg向左箭头

  8. smarty中三种变量的访问方式

    在模板中smarty有三种变量,第一种,php分配的变量,第二种配置文件里的变量,第三种,PHP全局数组里的变量,配置文件里变量的访问方式可以是{#bgcolor#},"#"必须紧 ...

  9. Android中Intent传值与Bundle传值的区别详解

    Android中Intent传值与Bundle传值的区别详解 举个例子我现在要从A界面跳转到B界面或者C界面   这样的话 我就需要写2个Intent如果你还要涉及的传值的话 你的Intent就要写两 ...

  10. 使用c#创建php可以调用的dll

    1. 创建一个 C# Class Library ,命名为:ClassLibraryDemo 2. 打开项目的属性,在点选左边的 “Application”(就是第一个tab) , 然后点击 Asse ...