后代是子、孙、曾孙等等。

通过 jQuery,您能够向下遍历 DOM 树,以查找元素的后代。


向下遍历 DOM 树

下面是两个用于向下遍历 DOM 树的 jQuery 方法:


jQuery children() 方法

children() 方法返回被选元素的所有直接子元素。

该方法只会向下一级对 DOM 树进行遍历。

下面的例子返回每个 <div> 元素的所有直接子元素:

实例

$(document).ready(function(){
  $("div").children();
});

尝试一下 »

您也可以使用可选参数来过滤对子元素的搜索。

下面的例子返回类名为 "1" 的所有 <p> 元素,并且它们是 <div> 的直接子元素:

实例

$(document).ready(function(){
  $("div").children("p.1");
});

尝试一下 »

提示:在本站的jQuery编程实战中,你可以通过实践来练习:jQuery使用children()操作子级元素


jQuery find() 方法

find() 方法返回被选元素的后代元素,一路向下直到最后一个后代。

下面的例子返回属于 <div> 后代的所有 <span> 元素:

实例

$(document).ready(function(){
  $("div").find("span");
});

尝试一下 »

下面的例子返回 <div> 的所有后代:

实例

$(document).ready(function(){
  $("div").find("*");
});

尝试一下 »

jQuery 遍历 – 后代的更多相关文章

  1. jQuery 遍历后代

    后代是子.孙.曾孙等等. 通过 jQuery,您能够向下遍历 DOM 树,以查找元素的后代. 向下遍历 DOM 树 下面是两个用于向下遍历 DOM 树的 jQuery 方法: children() f ...

  2. jQuery遍历-后代

    后代是子.孙.曾孙等等. 通过 jQuery,您能够向下遍历 DOM 树,以查找元素的后代. 向下遍历 DOM 树 下面是两个用于向下遍历 DOM 树的 jQuery 方法: children() f ...

  3. jQuery 遍历 - 后代

    向下遍历 DOM 树 下面是两个用于向下遍历 DOM 树的 jQuery 方法: children() find() jQuery children() 方法 children() 方法返回被选元素的 ...

  4. JQuery:JQuery遍历详解

    JQuery:遍历一.什么是遍历?jQuery 遍历,意为"移动",用于根据其相对于其他元素的关系来"查找"(或选取)HTML 元素.以某项选择开始,并沿着这个 ...

  5. 常用的jquery遍历函数

    1.Jquery遍历祖先 1).parent()  方法返回被选元素的直接父元素. 2).parents()  方法返回被选元素的所有祖先元素,它一路向上直到文档的根元素 (<html>) ...

  6. jquery遍历DOM方法总结

    1.jQuery 遍历 - 祖先 向上遍历 DOM 树 这些 jQuery 方法很有用,它们用于向上遍历 DOM 树: parent() parents() parentsUntil() jQuery ...

  7. jQuery遍历文档(重要)

    什么是遍历? jQuery 遍历,意为"移动",用于根据其相对于其他元素的关系来"查找"(或选取)HTML 元素.以某项选择开始,并沿着这个选择移动,直到抵达您 ...

  8. jQuery 遍历函数

    转载http://www.cnblogs.com/tylerdonet/archive/2013/04/05/3000618.html jQuery 遍历函数包括了用于筛选.查找和串联元素的方法. 函 ...

  9. Jquery遍历选中的input标签

    $("input[name='chkAgent']:[checked]").each(function () { alert($(this).attr("value&qu ...

随机推荐

  1. AOV网络和Kahn算法拓扑排序

    1.AOV与DAG 活动网络可以用来描述生产计划.施工过程.生产流程.程序流程等工程中各子工程的安排问题.   一般一个工程可以分成若干个子工程,这些子工程称为活动(Activity).完成了这些活动 ...

  2. hdu1443 Joseph---约瑟夫环

    题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=1443 题目大意: 一共有2k个人,分别为k个好人和k个坏人,现在我们需要每隔m个人把坏人挑出来,但是 ...

  3. Windows安装SVN服务器和客户端

    我的操作系统版本是windows10 64位.接下来我会先介绍SVN服务器的安装,然后再介绍安装SVN客户端,并进行测试. 下载 首先我们需要到官网上去下载svn服务器程序. [svn官网地址] (h ...

  4. 0323-DOM基础操作

    dom操作 1.找到元素(标签对象) 标签名: document.getElementsByTagName()[]; //返回的是数组类型,需要有下标来找内容 属性: document.getElem ...

  5. [C#]Google Chrome 书签导出并生成 MHTML 文件

    目的 因为某些原因需要将存放在 Google Chrome 内的书签导出到本地,所幸 Google Chrome 提供了导出书签的功能. 分析 首先在 Google Chrome 浏览器当中输入 ch ...

  6. [LeetCode] My Calendar I 我的日历之一

    Implement a MyCalendar class to store your events. A new event can be added if adding the event will ...

  7. c++类与对象(1)——构造,复制构造函数

    CPP的类与对象: 当我们定义一个基本类型变量时,方法如下: int p; #定义一个int类型变量 bool b; #定义一个bool类型变量 float c ; #定义一个float类型变量 显然 ...

  8. 一.Kylin的伪分布式安装

    一.伪分布式安装kylin 2018年4月15日 15:06 安装需要的环境 1. hadoop集群环境:由于安装的是CDH5.14.0的版本,所以相关组件都是跟5.14.0相关 2. spark采用 ...

  9. linux 基本使用命令

    arch 显示机器的处理器架构(1) uname -m 显示机器的处理器架构(2) uname -r 显示正在使用的内核版本 dmidecode -q 显示硬件系统部件 - (SMBIOS / DMI ...

  10. MQTT客户端库-Paho GO

    为了加深理解,本文是翻译文章.原文地址 Paho GO Client   语言 GO 协议 EPL AND EDL 官网地址 http://www.eclipse.org/paho/ API类型 As ...