`

jquery遍历-后代遍历

 
阅读更多
children() 方法返回被选元素的所有直接子元素。
find() 方法返回被选元素的后代元素,一路向下直到最后一个后代。


<style>
.descendants *
{ 
display: block;
border: 2px solid lightgrey;
color: lightgrey;
padding: 5px;
margin: 15px;
}
</style>
<script>
$(document).ready(function(){ 
   $("div").find("*").css({"color":"red","border":"2px solid red"});
   $("div").children().css({"color":"yellow","border":"2px solid yellow"});
});
</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>


  • 大小: 2.3 KB
分享到:
评论

相关推荐

    jQuery选择器 2.pptx

    3、遍历-后代;3、遍历-后代;3、遍历-后代;4、遍历-同胞;4、遍历-同胞;4、遍历-同胞;4、遍历-同胞;4、遍历-同胞;4、遍历-同胞;5、遍历-过滤;5、遍历-过滤;5、遍历-过滤;5、遍历-过滤;5、遍历-过滤;5、遍历-过滤

    jQuery 遍历 – 后代

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

    jquery 遍历 学习

    这个“jQuery遍历学习”的主题主要关注如何使用jQuery来高效地遍历DOM元素,以实现对网页内容的控制和操作。 首先,jQuery提供了多种遍历方法,包括基本的选择器和遍历函数。选择器如`$()`用于选取DOM元素,可以...

    jquery遍历节点树

    4. **$(selector).find(selector)**: 这是jQuery中最强大的遍历方法之一,它可以查找匹配子选择器的所有后代节点,无论它们是直接子节点还是更深层的子节点。例如,如果要找到所有`&lt;div&gt;`下的所有`&lt;span&gt;`元素,可以...

    JQuery遍历元素的后代和同胞实现方法

    在jQuery库中,有多种方法可以用来实现这种需求,接下来,我们将会详细解释如何使用children()和find()方法来遍历后代,以及如何使用siblings()方法来遍历同胞元素。 首先,让我们了解children()方法。children()...

    浅析jQuery 遍历函数,javascript中的each遍历_.docx

    jQuery 遍历函数和 JavaScript 中的 each 遍历 jQuery 遍历函数是 jQuery 库中的一组方法,用于筛选、查找和串联元素。这些方法可以帮助开发者快速地操作和处理 HTML 元素。下面是 jQuery 遍历函数的详细介绍: 1....

    jQuery 遍历函数详解

    下面我们详细讲解这些jQuery遍历函数的知识点。 .add()函数用于将元素添加到jQuery对象集合中。这个函数可以将新元素直接添加到现有的jQuery对象集合中,实现链式操作。 .andSelf()函数将之前操作返回的元素集添加...

    jquery学习-----jquery库讲义

    jQuery是一款流行的JavaScript库,它的主要目标是简化HTML文档遍历、事件处理、动画以及Ajax交互等操作,使得Web开发变得更加简单高效。通过提供丰富的API,jQuery极大地降低了JavaScript编程的难度,让开发者能够...

    jQuery--遍历操作实例小结【后代、同胞及过滤】

    1. **遍历后代** - `children()` 函数用于获取元素的所有直接子元素。例如,`$("div").children();` 将返回所有 `&lt;div&gt;` 元素的直接子元素。 - `find()` 函数则用于查找元素的所有后代,不论层级多深。`$("div")....

    jQuery01-入门

    - **定义**:jQuery是一款优秀的JavaScript库,它简化了HTML文档遍历、事件处理、动画以及Ajax交互等操作,使得网页开发变得更简单、快捷。 - **特点**: - **简洁**:使用简洁的语法替代复杂的原生JavaScript代码...

    jquery-1.7.2.js

    在性能方面,jQuery 1.7.2 进行了多处优化,比如更快的DOM遍历,减少内存占用,以及对现代浏览器的更好支持。这些优化使得在大型项目中使用jQuery 1.7.2 也能保持良好的运行效率。 最后,jQuery 1.7.2 对IE6-8等老...

    jQuery技术手册

    **4.3 jQuery遍历-后代** - **find(selector)`: 选择当前元素内部的元素。 **4.4 jQuery遍历-同胞** - **next()`: 选择当前元素的下一个同胞元素。 - **prev()`: 选择当前元素的上一个同胞元素。 - **siblings...

    JQuery遍历元素的父辈和祖先的方法

    接下来,我们将探讨如何使用JQuery遍历元素的父辈和祖先。 1. parent()方法 parent()方法用于获取当前选中元素的直接父辈元素。这是遍历父辈元素中最基础的方法。例如,在给定的代码片段中,通过点击一个按钮,使用...

    jQuery遍历DOM元素与节点方法详解

    以下是对jQuery遍历DOM元素与节点方法的详细解释: **一、向上遍历(祖先元素)** 1. `$(selector).parent([filter])`:返回匹配的元素的直接父元素。如果提供了过滤器`filter`,则只返回符合该过滤条件的父元素。...

    jQuery-3.3.1-API-Docs-CN jQuery离线文档

    1. **选择器**:jQuery的核心功能之一就是强大的选择器,如ID选择器("#id"),类选择器(".class"),元素选择器("tag"),以及组合选择器,如后代选择器("ancestor descendant"),相邻兄弟选择器("+")和通用兄弟选择器...

    JQuery遍历DOM节点的方法

    在学习JQuery时,DOM节点的遍历是极为重要的一部分。JQuery提供了一套丰富的API,使得开发者可以轻松地遍历和操作DOM元素。本文将详细介绍JQuery中用于遍历DOM节点的方法,并结合实例加以说明。 ### children()方法...

    浅析jQuery 遍历函数,javascript中的each遍历

    这是一个很好的实际应用例子,展示了如何在实际页面中应用jQuery遍历。 总的来说,jQuery的遍历函数提供了非常强大的机制来操作HTML文档,无论是在处理数组数据还是操作DOM元素时都非常方便。掌握这些遍历方法,...

    jQuery速成教程[收集].pdf

    jQuery 是一个广泛使用的JavaScript库,它极大地简化了HTML文档遍历、事件处理、动画和Ajax交互。本教程旨在快速引导你掌握jQuery的核心概念和技术,帮助你在短时间内提升网页开发的效率和质量。 ### 第一节:...

Global site tag (gtag.js) - Google Analytics