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. 【读书笔记《Android游戏编程之从零开始》】20.游戏开发基础(游戏数据存储)

    对于数据的存储,Android 提供了4种保存方式. (1)SharedPreference 此方法适用于简单数据的保持,文如其名,属于配置性质的保存,不适合比较大的情况,默认存放在手机内存里 (2) ...

  2. 【SQL 代码】Sql分页(自用)

    效果图: 下面是存储过程的创建,用的时候调用就行了 /****** Object: StoredProcedure [dbo].[spSqlPageByRownumber] Script Date: ...

  3. 怎样快速学会ZBrush 中的移动笔刷的运用

    本篇视频教程,进入ZBrush®最精彩章节,雕刻前我们需要认识的雕刻工具-笔刷.zbrush自带了多种笔刷供大家选择和使用,掌握和用好这些笔刷将让我们的雕刻工作更加自由.本课的内容将主要向大家介绍最基 ...

  4. codeforces 712B B. Memory and Trident(水题)

    题目链接: B. Memory and Trident time limit per test 2 seconds memory limit per test 256 megabytes input ...

  5. JSON对象和字符串之间的相互转换JSON.stringify(obj)和JSON.parse(string)

    在Firefox,chrome,opera,safari,ie9,ie8等高级浏览器直接可以用JSON对象的stringify()和parse()方法. JSON.stringify(obj)将JSO ...

  6. maven - pom.xml 聚合(父)工程 基本内容演示

    企业开发中所用到的基本jar包以及插件都已在此 可以自己根据实际情况酌情增减 <project xmlns="http://maven.apache.org/POM/4.0.0&quo ...

  7. [转]在Eclipse中使用JUnit4进行单元测试(高级篇)

    通过前2篇文章,您一定对JUnit有了一个基本的了解,下面我们来探讨一下JUnit4中一些高级特性. 一.高级Fixture 上一篇文章中我们介绍了两个Fixture标注,分别是@Before和@Af ...

  8. LoadRunner支持的IE版本

    LoadRunner支持的IE版本: 8.0 最高ie68.1 最高ie69.0 最高ie79.5 最高ie811.0 最高ie9( win7 32位+LR11+IE10可用,但win7 64位+LR ...

  9. 会动的大风车(css3)

    今天用css3的写了一个会动的大风车,使用translate和rotate布局,使用animation制作动画效果:分享给大家 <!DOCTYPE html> <html lang= ...

  10. System.Net.Sockets.Socket SendAsync System.ObjectDisposedException: Cannot access a disposed object.

    发生未处理的域异常! System.ObjectDisposedException: Cannot access a disposed object. Object name: 'System.Net ...