同胞拥有相同的父元素。

通过 jQuery,您能够在 DOM 树中遍历元素的同胞元素。


在 DOM 树中水平遍历

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

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

jQuery siblings() 方法

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

下面的例子返回 <span> 的所有同胞元素:

$("span").siblings();

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

下面的例子返回属于 <span> 的同胞元素的所有 class属性为"c1"的同胞元素:

$("span").siblings(".c1")

jQuery next() 方法

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

该方法只返回一个元素。

下面的例子返回 <span> 的下一个同胞元素:

$("span").next();

jQuery nextAll() 方法

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

下面的例子返回 <span> 的所有跟随的同胞元素:

$("span").nextAll();

jQuery nextUntil() 方法

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

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

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

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

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

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

  1. jQuery 遍历 – 同胞(siblings)

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

  2. jQuery 遍历同胞(siblings)

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

  3. jQuery 遍历 - 同胞(siblings)

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

  4. JQuery:JQuery遍历详解

    JQuery:遍历一.什么是遍历?jQuery 遍历,意为"移动",用于根据其相对于其他元素的关系来"查找"(或选取)HTML 元素.以某项选择开始,并沿着这个 ...

  5. jQuery 遍历用法

    jQuery 遍历 DOM 树 parent() 方法返回被选元素的直接父元素(找爸爸). parents() 方法返回被选元素的所有祖先元素,它一路向上直到文档的根元素 (找长辈). parents ...

  6. 常用的jquery遍历函数

    1.Jquery遍历祖先 1).parent()  方法返回被选元素的直接父元素. 2).parents()  方法返回被选元素的所有祖先元素,它一路向上直到文档的根元素 (<html>) ...

  7. jquery遍历DOM方法总结

    1.jQuery 遍历 - 祖先 向上遍历 DOM 树 这些 jQuery 方法很有用,它们用于向上遍历 DOM 树: parent() parents() parentsUntil() jQuery ...

  8. jQuery遍历文档(重要)

    什么是遍历? jQuery 遍历,意为"移动",用于根据其相对于其他元素的关系来"查找"(或选取)HTML 元素.以某项选择开始,并沿着这个选择移动,直到抵达您 ...

  9. jQuery遍历DOM

    jQuery提供了多种遍历DOM的方法.遍历方法中最大的种类是树遍历. 向上遍历DOM树 parent():返回被选元素的直接父元素 parents():返回被选元素的所有祖先元素,它一直遍历到根元素 ...

随机推荐

  1. jmeter问题处理随笔1 - CSV取值数据异常处理(包含"号,","号的情况)

    背景 jmeter测试中通过CSV进行用例数据的管理,在result断言中间需要使用json格式的数据,会包含 " ",",这个时候发现CSV取值会报错或者乱码 解决 用 ...

  2. STM32使用cube生成的程序后在keil5编译后首次SWD可以下载再次下载不行的解决办法。

    使用cube配置导出工程在keil5编译后首次SWD下载可以再次下载不行的解决办法. 1原因: cube使用的是HAL库,初始化语句里面禁用了调试功能. 在stm32f1xx_hal_msp.c中 _ ...

  3. ueditor编辑器使用总结

    ueditor使用小结 一.简介 ueditor是百度编辑器,官网地址:http://ueditor.baidu.com/website/ 完整的功能演示,可以参考:http://ueditor.ba ...

  4. vscode 开发.net core 从安装到部署 教程详解

    一:环境准备: windows系统需要 win7 sp1 / windows 8  / windows 2008 r2 sp1 / windows10: 其他版本的windows系统在安装.NET C ...

  5. 初学 Python(十二)——高阶函数

    初学 Python(十二)--高阶函数 初学 Python,主要整理一些学习到的知识点,这次是高阶函数. #-*- coding:utf-8 -*- ''''' 话说高阶函数: 能用函数作为参数的函数 ...

  6. 【附答案】Java 大数据方向面试题,你会几个?

    1.Collection 和 Collections的区别.   Collections是个java.util下的类,它包含有各种有关集合操作的静态方法.   Collection是个java.uti ...

  7. vscode--搭建自动编译sass环境

    一,安装插件及使用步骤 1.vscode安装Live Sass Compiler,由于该插件依赖Live Server ,所以会自动安装Live Server 2.点击vscode底部的Watch m ...

  8. 深入理解Spring MVC 思想

    目录  一.前言二.spring mvc 核心类与接口三.spring mvc 核心流程图 四.spring mvc DispatcherServlet说明 五.spring mvc 父子上下文的说明 ...

  9. 3.commonjs模块

    1.首先建一个math.js exports.add = function(a, b){ return a + b; } exports.sub = function(a, b){ return a ...

  10. T-SQL笔记总结(1)

    --1.创建一个数据库 createdatabase School; --删除数据库 dropdatabase School; --创建一个数据库的时候,指定一些数据库的相关参数,比如大小,增长方式, ...