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 ...
随机推荐
- redis宕机时哨兵的处理
https://blog.csdn.net/a67474506/article/details/50435498 redis宕机是的故障处理 重启故障机 sentinel.conf 的配置会改变
- Node JS复制文件
/** * Created by Administrator on 2019/11/6. *指尖敲打着世界 ----一个阳光而又不失帅气的少年!!!. */ var fs=require(" ...
- [转]synchronized的锁机制
参考文章:https://blog.csdn.net/lang_programmer/article/details/72722751 synchronized是否是可重入锁 https:// ...
- Constructor、Method、Field 源码阅读
AnnotatedElement /** * AnnotatedElement 接口表示目前正在此 VM 中运行的应用程序的一个已注解元素[类.方法.属性]. * 该接口允许反射性地读取注解.此接口中 ...
- 关于Android Studio加载.so文件问题
在main文件下创建jniLibs文件,然后把.so文件copy过去,然后在 app的 build.gradle里面添加如下代码 sourceSets { main { jniLibs.srcDirs ...
- Flask中session实现原理
前言 flask_session是flask框架实现session功能的一个插件,用来替代flask自带的session实现机制,flask默认的session信息保存在cookie中,不够安全和灵活 ...
- JAVA记事本的图形用户界面应用程序含过滤
JAVA记事本的图形用户界面应用程序 过滤 题目简介: 整体分析: 实验代码: package note; import java.awt.EventQueue; import java.awt.ev ...
- jmeter响应数据中文乱码处理
1.在jmeter的bin目录下找到 jmeter.properties 文件并打开 2.搜索关键字 “default.encoding”,将1084行(以搜索到的位置为准)改成下图所示:samp ...
- 《Linux命令行大全》 笔记记录
1.Shell是什么 2.(文件目录)导航 3.Linux系统 4.操作文件和目录 5.命令的使用 6.重定向 7.透过shell看世界 扩展 引用 8.高级键盘技巧 9.权限 10.进程 11.环境 ...
- 浅谈TCP扫描与SYN扫描与FIN扫描
下面就这三种方法来小小的探讨一下,不对的地方还请多多指教! 1:TCP扫描 相对来说是速度比较慢的一种,为什么会慢呢?因为这种方法在扫描的时候会从本地主机的一个端口向目标主机的一个端口发出一个连接请求 ...