在 DOM 树中水平遍历

有许多有用的方法让我们在 DOM 树进行水平遍历:

  • siblings()
  • next()
  • nextAll()
  • nextUntil()
  • prev()
  • prevAll()
  • prevUntil()

jQuery siblings() 方法

siblings() 方法返回被选元素的所有同胞元素。

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

下面的例子返回属于 <h2> 的同胞元素的所有 <p> 元素:

$("h2").siblings("p");

jQuery next() 方法

next() 方法返回被选元素的下一个同胞元素。

该方法只返回一个元素。

jQuery nextAll() 方法

nextAll() 方法返回被选元素的所有跟随的同胞元素。

jQuery nextUntil() 方法

nextUntil() 方法返回介于两个给定参数之间的所有跟随的同胞元素。

下面的例子返回介于 <h2> 与 <h6> 元素之间的所有同胞元素:

$("h2").nextUntil("h6");

jQuery prev(), prevAll() & prevUntil() 方法

prev(), prevAll() 以及 prevUntil() 方法的工作方式与上面的方法类似,只不过方向相反而已:它们返回的是前面的同胞元素(在 DOM 树中沿着同胞元素向后遍历,而不是向前)。

DOM 遍历-同胞的更多相关文章

  1. JQuery总结:选择器归纳、DOM遍历和事件处理、DOM完全操作和动画 (转)

    JQuery总结:选择器归纳.DOM遍历和事件处理.DOM完全操作和动画 转至元数据结尾 我们后台可能用到的页面一般都是用jquery取值赋值的,发现一片不错的文章 目录 JQuery总结一:选择器归 ...

  2. DOM遍历

    前面的话 DOM遍历模块定义了用于辅助完成顺序遍历DOM结构的类型:Nodeiterator和TreeWalker,它们能够基于给定的起点对DOM结构执行深度优先(depth-first)的遍历操作. ...

  3. 玩转DOM遍历——用NodeIterator实现getElementById,getElementsByTagName方法

    先声明一下DOM2中NodeIterator和TreeWalker这两类型真的只是用来玩玩的,因为性能不行遍历起来超级慢,在JS中基本用不到它们,除了<高程>上有两三页对它的讲解外,谷歌的 ...

  4. jQuery 源码分析(十九) DOM遍历模块详解

    jQuery的DOM遍历模块对DOM模型的原生属性parentNode.childNodes.firstChild.lastChild.previousSibling.nextSibling进行了封装 ...

  5. jQuery 遍历同胞(siblings)

    同胞拥有相同的父元素. 通过 jQuery,您能够在 DOM 树中遍历元素的同胞元素. 在 DOM 树中水平遍历 有许多有用的方法让我们在 DOM 树进行水平遍历: siblings() next() ...

  6. jQuery遍历-同胞

    同胞拥有相同的父元素. 通过 jQuery,您能够在 DOM 树中遍历元素的同胞元素. 在 DOM 树中水平遍历 有许多有用的方法让我们在 DOM 树进行水平遍历: siblings() next() ...

  7. jQuery 遍历 – 同胞(siblings)

    同胞拥有相同的父元素. 通过 jQuery,您能够在 DOM 树中遍历元素的同胞元素. 在 DOM 树中水平遍历 有许多有用的方法让我们在 DOM 树进行水平遍历: siblings() next() ...

  8. jQuery 遍历 - 同胞(siblings)

    同胞拥有相同的父元素. 通过 jQuery,您能够在 DOM 树中遍历元素的同胞元素. 在 DOM 树中水平遍历 有许多有用的方法让我们在 DOM 树进行水平遍历: siblings() next() ...

  9. DOM遍历 - 后代

    jQuery children() 方法 children() 方法返回被选元素的所有直接子元素. 该方法只会向下一级对 DOM 树进行遍历. 您也可以使用可选参数来过滤对子元素的搜索. 下面的例子返 ...

随机推荐

  1. GitHub使用(二) - 新建文件夹

    1.首先打开我们已经建好的仓库 "test.github.com" 页面,可以看到如下图页面,找到“新建文件Create new file”按钮并点击.

  2. mybatis枚举映射成tinyint

    第一步:定义顶级枚举接口 public interface BaseEnum<E extends Enum<?>, T> { public T getCode(); publi ...

  3. IDEA- idea代码调试debug

    IDEA有很多的快捷键,下面整理Debug的快捷键,方便自己使用!(阅读本篇可能花费您2分钟,需要多的实践练习) F9 resume programe 恢复程序 Alt+F10 show execut ...

  4. 利用百度地图WEB服务APIGeoCoding API批量地址解析

    Geocoding API包括地址解析和逆地址解析功能: 地理编码:即地址解析,由详细到街道的结构化地址得到百度经纬度信息,例如:“北京市海淀区中关村南大街27号”地址解析的结果是“lng:116.3 ...

  5. php中常用的字符串比较函数strcmp()实例解释

    int strcmp ( string $str1 , string $str2 ) 以二进制方式进行比较以该函数比较时区分大小写返回值,如果str1小于str2返回<0,如果str1大于str ...

  6. 单独创建一个Android Test Project 时junit 的配置和使用

    现在的集成ADT后Eclipse都可以直接创建Android Test Project 如图所示: 命名后选择你要测试的单元程序,比如我自己准备测试sms,便可以如图所示那样选择 本人新建的测试工程为 ...

  7. Spring -- 配置bean的三种方法

    配置通过静态工厂方法创建的bean public class StaticBookFactory { //静态工厂方法: public static Book getBook(String bookN ...

  8. Python 基础之函数、深浅copy,set及练习

    三元运算符通常在Python里被称为条件表达式,这些表达式基于真(true)/假(not)的条件判断,在Python 2.4以上才有了三元操作. 语法格式: X if C else Y 有了三元表达式 ...

  9. 快速高效掌握企业级项目中的Spring面向切面编程应用,外带讲面试技巧

    Spring面向切面编程(AOP)是企业级应用的基石,可以这样说,如果大家要升级到高级程序员,这部分的知识必不可少. 这里我们将结合一些具体的案例来讲述这部分的知识,并且还将给出AOP部分的一些常见面 ...

  10. 初学者易上手的SSH-struts2 04值栈与ognl表达式

    什么是值栈?struts2里面本身提供的一种存储机制,类似于域对象,值栈,可以存值和取值.,特点:先进后出.如果将它当做一个容器的话,而这个容器有两个元素,那么最上面的元素叫做栈顶元素,也就是所说的压 ...