jQuery：元素遍历

最新推荐文章于 2023-03-16 15:27:10 发布
最新推荐文章于 2023-03-16 15:27:10 发布
阅读量870 收藏 2
点赞数 1
分类专栏： jQuery
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/willard_cui/article/details/81348807
版权

遍历 DOM 树

1、向上遍历DOM树

parent() 方法选取被选元素的直接父元素。

parents() 方法选取被选元素的所有祖先元素，它一路向上直到文档的根元素 (<html>)。

parentsUntil() 方法选取介于两个给定元素之间的所有祖先元素。

$("span").parent();//li
$("span").parents();//li ul div
$("span").parentsUntil("div");//li ul

2、向下遍历DOM树

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

find()方法选取被选元素的后代元素，直到最后一个后代。

$("div").children();//选取div元素的所有直接子元素
$("div").children("p.class");//选取div直接子元素中所有类名为class的p元素。
$("div").find("*");//选取div元素所有子元素
$("div").find("span");//选取div后代所有的span元素

3、水平遍历DOM树

siblings()方法选取被选元素所有的同胞元素

next()方法选取被选元素的下一个同胞元素，

nextAll()方法选取被选元素之后的所有同胞元素，

nextUtil()方法选取被选元素与给定参数之间的所有同胞元素，

          $("h2").nextUtil("h6");//选取h2-h6之间的所有同胞元素

prev()方法选取被选元素的上一个同胞元素，

prevAll()方法选取被选元素之前的所有同胞元素，

prevUtil()方法选取给定参数与被选元素之间的所有同胞元素。

4、过滤

first()方法选取被选元素的首个元素。

         $("div p").first();//选取首个div元素内部的第一个p元素

            last()方法选取被选元素的最后一个元素。

        $("div p").last();//选择最后一个div元素的最后一个p元素

eq()方法选择被选元素中带有指定索引号的元素

        $("p").eq(1);//选取第二个p元素（索引号 1）

 

filter()方法选取被选元素中与给定参数相匹配的元素

        $("p").filter(".class");//选择带有类名class的p元素

           not()方法选取被选元素中与给定参数不匹配的元素

        $("p").not(".class");//选择类名不是class 的p元素

 

 

 

 

 

 

 

 

 

 

willard_cui
关注
专栏目录
Jquery遍历元素
qq_43781887的博客
07-12 5048
在讲这个之前，建议先看一下jquery的隐式迭代，这个就不多说了，隐式迭代的缺点在于它只能集体进行操作不能只针对某个元素进行操作，可以看下面的代码： 如果想要依次对遍历的元素进行操作需要用each方法，语法是：$('div').each(function(index,domEle){})1.each()方法遍历匹配每一个元素。2.里面的回调函数有两个参数分别是index和domEle，index是每个元素的索引号，domEle是每个DOM元素对象，不是jquery对象，所以如果要用jquery的方法必须
jQuery 遍历方法
最新发布
xyq2024的博客
08-12 370
遍历是指按照一定的顺序访问集合中的每个元素。在 jQuery 中，遍历通常指的是对 DOM 元素集合的遍历。jQuery 提供了一系列方法来遍历和操作 DOM 元素，使得开发者能够更加高效地处理复杂的网页结构。jQuery 提供了丰富的遍历方法，使得 DOM 操作变得更加简单和直观。掌握这些方法对于高效的前端开发至关重要。在实际开发中，根据具体的需求选择合适的遍历方法，可以大大提高开发效率。
jQuery - 元素遍历
立志欲坚不欲锐，成功在久不在速度
11-23 954
前言： 一提到“遍历”,大家一般都能联想到 each() 或者 for()等语法，但是在jQuery中究竟什么是遍历？ 什么是遍历： jQuery 遍历，意为"移动"，用于根据其相对于其他元素的关系来"查找"（或选取）HTML 元素。以某项选择开始，并沿着这个选择移动，直到抵达您期望的元素为止。 下图展示了一个家族树。通过 jQuery 遍...
jq遍历元素
My52Hz
04-05 3363
jq遍历元素总结 通过jq遍历元素、并控制一些元素的属性（显示/隐藏、value、src等等），是我们在开发之中比较常见的操作，也为我们的业务功能扩宽了方向，接下来我将结合近段时间在工作上的际遇粗略介绍一下一些稍稍复杂的jq遍历。 案例一 需求背景： 通过获取被点击元素，并以此为基准，遍历该元素的其他元素，控制其他元素的一些属性。 功能需求： 通过获取被点击的元素a标签，给该元素设置背景颜色，并恢...
JQuery页面前端遍历样例
sty2008boy的专栏
12-01 129
 JQuery遍历1:CssClass遍历元素 将所有的checkbox设置为未选中，采用遍历的方法来完成 控件如下 &lt;button id="ClearPosition" type="button"&gt;清空职位&lt;/button&gt; &lt;input type="checkbox" class="jobPostaJoblist"/&gt;&
jquery元素遍历
wml
08-05 525
1、遍历祖先元素：parent() ：返回被选元素的直接父元素。$(document).ready(function(){ $("span").parent(); });parents() ： 返回被选元素的所有祖先元素，它一路向上直到文档的根元素 ()。$(document).ready(function(){ $("span").parents(); });//也可以使用可选参数来过滤
Educoder：jQuery遍历
QingNiaoJun的博客
04-25 5068
目录：第1关：jQuery——遍历DOM元素的祖先元素第2关：jQuery——遍历DOM元素的后代元素第3关：jQuery——遍历DOM元素的兄弟元素第4关：jQuery遍历——过滤 第1关：jQuery——遍历DOM元素的祖先元素 任务描述 本关任务：用 jQuery 遍历 DOM 的祖先元素。效果如下： 参考答案 <!doctype html> <html lang="en"> <head> <meta charset="UTF-8">
jquery遍历select元素(实例讲解)
12-12
本篇文章提供一款jquery遍历select教程代码，主要是利用了$(“#<%=ddl_xreg_id.clientid%> option”).each(function() {形式来each遍历一次，这样所有的select就给查询了一次。 代码如下:[removed][removed]...
jq遍历子元素_jquery:::选择器/遍历/获取所有的子元素、兄弟元素
weixin_39986027的博客
12-22 1846
jquery是一个基于javascript的轻量级工具包，是基于javascript的函数库，它使得javascript开发更加高效快捷。1，jquery的选择器分为：基本选择器(又分为id选择器和类选择器)eg:$('#id')；//通过元素id选择，要在id前加 # 号，类似于cssid选择器的命名$('.class');//类选择器，选择同一类的所有元素$('html');//html...
jQuery 元素遍历
weixin_30689307的博客
07-09 408
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style> #div1, #div3 { width: 400px; height: 300px; ...
jQuery 遍历方法总结
忧郁的蛋的专栏
03-16 8134
5、each()，用于为每个匹配元素执行函数；在部分浏览器中不管用可以用prop，如果只是判断可以用$(this).find("ul>li>:checkbox:eq(" + i + ")").is(":checked");nextUntil()方法，主要用于获得指定元素的下一个同级元素，这个同级元素必须为指定元素与nextUntil()方法所设置元素之间的元素。prevUntil()方法，主要用于获得指定元素的上一个同级元素，这个同级元素必须为指定元素与prevUntil()方法所设置元素之间的元素。
jQuery遍历
haandxc的博客
06-17 513
jQuery遍历jQuery向上遍历 parent() - 返回被选元素的直接父元素 parents() - 返回被选元素的所有祖先元素 parentsUntil() - 返回介于两个给定元素之间的所有祖先元素 jQuery向下遍历 children() - 返回被选元素的所有直接子元素 find() - 返回被选元素的后代元素，一路向下直到最后一个后代 jQuery同节点遍历 siblings()
【jQuery：遍历相同class的所有值，遍历某一列td的值】
weixin_30922589的博客
06-10 281
jsp代码： Html代码 <c:forEach var="main" items="${mainPage.list }"> <tr> <td><a class="sceneStr_td">${main.sceneStr }</a></td> <t...
jquery多种遍历方法
奇妙的博客
08-20 201
prev()  prev() 获得匹配元素集合中每个元素紧邻的前一个同胞元素，可使用选择器进行筛选。 $("p").prev()//获得"p"前一个元素 next() next() 获得匹配元素集合中每个元素紧邻的同胞元素。如果提供选择器，则取回匹配该选择器的 下一个同胞元素。 $("p").next()//获得"p"后一个元素 siblings() siblings() 获得...
Jquery—遍历元素
生如夏花 炫至茶靡
12-24 1429
1.遍历祖先 向上遍历 DOM 树的几个方法： parent()—返回被选元素的直接父元素，该方法只会向上一级对 DOM 树进行遍历 parents()—返回被选元素的所有祖先元素，它一路向上直到文档的根元素 () parentsUntil()—返回介于两个给定元素之间的所有祖先元素 用法： $("span").parent().toggleClass("green
jquery遍历
iOSbird的博客
11-02 1716
什么是jquery遍历，意为“移动”，用于根据其相对于其他元素的关系来“查找”（或选取）HTML元素。以某项选择开始，并沿着这个选择移动，直到抵达期望的元素为止。 下图展示了一个家族树。通过 jQuery 遍历，您能够从被选（当前的）元素开始，轻松地在家族树中向上移动（祖先），向下移动（子孙），水平移动（同胞）。这种移动被称为对 DOM 进行遍历。 元素
jquery遍历子元素的写法
纸上得来终觉浅
10-27 8223
jquery遍历子元素的语法
jQuery基础：常用遍历节点方法详解
本篇文章是关于jQuery基础教程，主要讲解了如何在JavaScript编程中有效地遍历和操作HTML节点。jQuery是一个流行的JavaScript库，它简化了前端开发者的DOM操作和事件处理，提高了开发效率。 首先，文章介绍了jQuery...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值