jQuery 遍历 - 后代
向下遍历 DOM 树
下面是两个用于向下遍历 DOM 树的 jQuery 方法:
- children()
- find()
jQuery children() 方法
children() 方法返回被选元素的所有直接子元素。
该方法只会向下一级对 DOM 树进行遍历。
下面的例子返回每个 <div> 元素的所有直接子元素:
code:
<!DOCTYPE html>
<html>
<head>
<style>
.descendants *
{
display: block;
border: 2px solid lightgrey;
color: lightgrey;
padding: 5px;
margin: 15px;
}
</style>
<script src="/jquery/jquery-1.11.1.min.js">
</script>
<script>
$(document).ready(function(){
$("div").children().css({"color":"red","border":"2px solid red"});
});
</script>
</head>
<body>
<div class="descendants" style="width:500px;">div (当前元素)
<p>p (子)
<span>span (孙)</span>
</p>
<p>p (child)
<span>span (孙)</span>
</p>
</div>
</body>
</html>

您也可以使用可选参数来过滤对子元素的搜索。
下面的例子返回类名为 "1" 的所有 <p> 元素,并且它们是 <div> 的直接子元素:
code:
<script>
$(document).ready(function(){
$("div").children("p.1").css({"color":"red","border":"2px solid red"});
});
</script>
<div class="descendants" style="width:500px;">div (当前元素)
<p class="1">p (子)
<span>span (孙)</span>
</p>
<p class="2">p (子)
<span>span (孙)</span>
</p>
</div>

jQuery find() 方法
find() 方法返回被选元素的后代元素,一路向下直到最后一个后代。
下面的例子返回属于 <div> 后代的所有 <span> 元素:
code:
<script>
$(document).ready(function(){
$("div").find("span").css({"color":"red","border":"2px solid red"});
});
</script>

下面的例子返回 <div> 的所有后代:
<script>
$(document).ready(function(){
$("div").find("*").css({"color":"red","border":"2px solid red"});
});
</script>

jQuery 遍历 - 后代的更多相关文章
- jQuery 遍历后代
后代是子.孙.曾孙等等. 通过 jQuery,您能够向下遍历 DOM 树,以查找元素的后代. 向下遍历 DOM 树 下面是两个用于向下遍历 DOM 树的 jQuery 方法: children() f ...
- jQuery遍历-后代
后代是子.孙.曾孙等等. 通过 jQuery,您能够向下遍历 DOM 树,以查找元素的后代. 向下遍历 DOM 树 下面是两个用于向下遍历 DOM 树的 jQuery 方法: children() f ...
- jQuery 遍历 – 后代
后代是子.孙.曾孙等等. 通过 jQuery,您能够向下遍历 DOM 树,以查找元素的后代. 向下遍历 DOM 树 下面是两个用于向下遍历 DOM 树的 jQuery 方法: children() f ...
- JQuery:JQuery遍历详解
JQuery:遍历一.什么是遍历?jQuery 遍历,意为"移动",用于根据其相对于其他元素的关系来"查找"(或选取)HTML 元素.以某项选择开始,并沿着这个 ...
- 常用的jquery遍历函数
1.Jquery遍历祖先 1).parent() 方法返回被选元素的直接父元素. 2).parents() 方法返回被选元素的所有祖先元素,它一路向上直到文档的根元素 (<html>) ...
- jquery遍历DOM方法总结
1.jQuery 遍历 - 祖先 向上遍历 DOM 树 这些 jQuery 方法很有用,它们用于向上遍历 DOM 树: parent() parents() parentsUntil() jQuery ...
- jQuery遍历文档(重要)
什么是遍历? jQuery 遍历,意为"移动",用于根据其相对于其他元素的关系来"查找"(或选取)HTML 元素.以某项选择开始,并沿着这个选择移动,直到抵达您 ...
- jQuery 遍历函数
转载http://www.cnblogs.com/tylerdonet/archive/2013/04/05/3000618.html jQuery 遍历函数包括了用于筛选.查找和串联元素的方法. 函 ...
- Jquery遍历选中的input标签
$("input[name='chkAgent']:[checked]").each(function () { alert($(this).attr("value&qu ...
随机推荐
- BitmapRegionDecoder
Android加载大图——BitmapRegionDecoder(转) BitmapRegionDecoder,从API10就引入了.如下图: NPONRY0T35GE$13{254X8Z1. ...
- android 实例-弱引用示例 Handler正确使用方法
实际问题 android 习惯性问题:在使用handler的时候喜欢使用内部类形式. private final Handler handler = new Handler(){ @Override ...
- Win10 的微软输入法输入稍快竟然会导致死机
一周前,新装机器一次,竟然死机两三次,多发生在敲字时,最近逐步排查发现的这个问题,查阅了一下网上方案,果断采用了第三方输入法,至今没再死机过. 不过第三方输入法也不安分,是不是推送点头条新闻过来,和驱 ...
- linux vim的全目录搜索 和 hostname的设置?
vim下的搜索命令是: vimgrep, 简写就是vim. 关于这个全局搜索的用法根grep的差不多, 但是, 如果你直接使用 grep的话 就会在vim的外部执行, 根vim内部就没有什么关系了, ...
- JSTL标签(核心标准库)
使用JSTL标签步骤 1) 导入jstl支持的jar包(标签背后隐藏的java代码) 注意:使用javaee5.0的项目自动导入jstl支持jar包 2)使用taglib指令导入标签库 <%@t ...
- Qt输出中文乱码的问题
/* 我遇到的情况: 文件编码为UTF-8.程序输输出中文位乱码. 解决方案: 1. 工具->选项->环境->语言: Chinese 2. 选项->文本编辑器->行为-& ...
- 已经配置好了的 jmeter + ant 框架
已经配置好了的 jmeter + ant 框架 ,需要自取,避免查找安装攻略时耗费时间 使用前需配置环境变量,阅读文件内安装文档!!! 链接:https://pan.baidu.com/s/1eRz9 ...
- caoz的梦呓:所谓打破信息不对称,其实是一种幻觉
猫宁!!! 参考链接:https://mp.weixin.qq.com/s/UzSyrhe0Vck7ItN-XU6JEg 很多创业者说,要建立怎样一个平台,要打破信息不对称,大部分时候,我都会泼冷水, ...
- @ComponentScan 注解
在配置类上添加 @ComponentScan 注解.该注解默认会扫描该类所在的包下所有的配置类,相当于xml的 <context:component-scan>. @ComponentSc ...
- Django book 2.0 的中文翻译
传送门大法好: http://djangobook.py3k.cn/2.0/