jquery 同胞 siblings next nextAll nextUtil pre preAll preUtil

小咪咪 2022-05-23 12:43 109阅读 0赞

同胞拥有相同的父元素。

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

--------------------

## 在 DOM 树中水平遍历 ##

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

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

--------------------

## jQuery siblings() 方法 ##

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

下面的例子返回 <h2> 的所有同胞元素：

## 实例 ##

$ ( document ) . ready ( function ( ) \{   $ ( " h2 " ) . siblings ( ) ; \} ) ;

[尝试一下 »][Link 1]

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

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

## 实例 ##

$ ( document ) . ready ( function ( ) \{   $ ( " h2 " ) . siblings ( " p " ) ; \} ) ;

[尝试一下 »][Link 2]

--------------------

## jQuery next() 方法 ##

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

该方法只返回一个元素。

下面的例子返回 <h2> 的下一个同胞元素：

## 实例 ##

$ ( document ) . ready ( function ( ) \{   $ ( " h2 " ) . next ( ) ; \} ) ;

[尝试一下 »][Link 3]

--------------------

## jQuery nextAll() 方法 ##

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

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

## 实例 ##

$ ( document ) . ready ( function ( ) \{   $ ( " h2 " ) . nextAll ( ) ; \} ) ;

[尝试一下 »][Link 4]

--------------------

## jQuery nextUntil() 方法 ##

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

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

## 实例 ##

$ ( document ) . ready ( function ( ) \{   $ ( " h2 " ) . nextUntil ( " h6 " ) ; \} ) ;

[尝试一下 »][Link 5]

--------------------

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

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

[Link 1]: http://www.runoob.com/try/try.php?filename=tryjquery_siblings
[Link 2]: http://www.runoob.com/try/try.php?filename=tryjquery_siblings2
[Link 3]: http://www.runoob.com/try/try.php?filename=tryjquery_next
[Link 4]: http://www.runoob.com/try/try.php?filename=tryjquery_nextall
[Link 5]: http://www.runoob.com/try/try.php?filename=tryjquery_nextuntil

发表评论取消回复

表情：

评论列表（有 0 条评论，109人围观）

还没有评论，来说两句吧...

相关阅读

相关 jQuery 遍历 - 同胞(siblings)

同胞拥有相同的父元素。通过 jQuery，您能够在 DOM 树中遍历元素的同胞元素。 -------------------- 在 DOM 树中水平遍历有许多有

本是古典何须时尚/ 2024年03月17日 10:37/ 0 赞/ 44 阅读

相关 jQuery 遍历 - 同胞(siblings)

同胞拥有相同的父元素。通过 jQuery，您能够在 DOM 树中遍历元素的同胞元素。 -------------------- 在 DOM 树中水平遍历有许多有

拼搏现实的明天。/ 2024年03月16日 11:24/ 0 赞/ 64 阅读

相关 jQuery必会的增删改查Dom操作1(val、next、prve、nextAll、nextUntil、siblings、parent 、 parents、closest、slice

jQuery必会的增删改查Dom操作1 取赋值相关方法：val next和prev对比看 next p

骑猪看日落/ 2023年07月16日 03:55/ 0 赞/ 9 阅读

相关 jQuery（一）sibling方法

![这里写图片描述][20151012153536637] sibling方法是获得同辈元素。这个单词中文解释就是兄弟姐妹的意思。可以传入选择器或者正则表达式作为参数 ne

一时失言乱红尘/ 2022年08月09日 05:21/ 0 赞/ 156 阅读

相关 BeautifulSoup的高级应用之.parent .parents .next_sibling.previous_sibling.next_siblings.previous_siblings

[继上一篇BeautifulSoup的高级应用，主要讲解的是contents children descendants string strings stripped\_str

曾经终败给现在/ 2022年08月04日 08:40/ 0 赞/ 155 阅读

相关 jQuery prev~siblings选择器

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <ti

左手的ㄟ右手/ 2022年07月13日 10:26/ 0 赞/ 139 阅读

相关 jquery 同胞 siblings next nextAll nextUtil pre preAll preUtil

同胞拥有相同的父元素。通过 jQuery，您能够在 DOM 树中遍历元素的同胞元素。 -------------------- 在 DOM 树中水平遍历有许多有

小咪咪/ 2022年05月23日 12:43/ 0 赞/ 110 阅读

相关 jQuery找兄弟系列next(),nextAll(),nextUntil(),prev(),prevAll(),prevUntil(),siblings()

作者：老默 [http://www.cnblogs.com/laomo/ ][http_www.cnblogs.com_laomo] jQuery找兄弟系列next(),ne

亦凉/ 2022年04月17日 03:13/ 0 赞/ 173 阅读

相关 jquery中获取相邻元素相关的命令：next()、prev()和siblings()

jquery里我们要获取某个元素的相邻元素时，可以用到的命令有三个： next():用来获取下一个同辈元素。 prev():用来获取上一个同辈元素。 siblings()

阳光穿透心脏的1/2处/ 2022年02月26日 16:24/ 0 赞/ 390 阅读

相关 jQuery--遍历节点之同袍遍历（siblings()、next()、nextAll()、nextUntil()）详解

同袍遍历所谓同袍节点，是指拥有相同父元素的节点。在jQuery中提供了多种同袍节点遍历的方法，如siblings()、next()、nextAll()、prev()、p

╰+攻爆jí腚メ/ 2021年08月13日 15:30/ 0 赞/ 370 阅读