浅谈jquery中next与siblings的区别

浅谈jquery中next与siblings的区别

下面简单说说jquery中next和siblings的区别。我觉得边肖挺好的。我现在就分享给你,给你一个参考。来和边肖一起看看吧。

兄弟姐妹([表达式]):

概述

获取一个包含匹配元素集中每个元素的所有唯一同级元素的元素集。

[expr]:您可以使用可选表达式进行过滤。用于筛选对等元素的表达式

示例

找到每个div的所有对等元素。

HTML 代码:

p又见面了

jQuery 代码:

$(div )。兄弟姐妹()

结果:

[ pHello/p,pAnd Again/p ]

在每个div的所有对等元素中找到具有所选类名的元素。

HTML 代码:

div span hello/span/divp class= selected 再次问好/p再次问候/p

jQuery 代码:

$(div )。兄弟姐妹(’。选定’)

结果:

[p class= selected hello Again/p]next([expr]):

获取包含匹配元素集中每个元素的下一个同级元素的元素集。

这个函数只返回下一个兄弟元素,而不是后面所有的兄弟元素(可以使用nextAll)。您可以使用可选表达式进行筛选。

示例

描述:

在每个段落后立即找到对等元素。

HTML 代码:

pHello/PP hello Again/pdiv span and Again/span/div

jQuery 代码:

$(p )。下一个()

结果:

[又是pHello,divspanAnd又是/span/div ]

描述:

在每个段落之后的对等元素中找到类名被选中的元素。

HTML代码:

pHello/PP class= selected hello Again/pdiv span and Again/span/div

jQuery 代码:

$(p )。下一个(’。选定’)

结果:

[p class= selected hello Again/p]

Next ([expr]):查找当前元素之后的所有对等元素。

示例:

描述:

向第一个div之后的所有元素添加一个类。

HTML 代码:

div/divdiv/divdiv/divdiv

JQuery代码:

$(div:first )。nextAll()。add class(“after”);

结果:

[ div class=after/div,div class=after/div,div class=after/div ]

实际应用案例

删除第一个TR元素之后的所有TR,然后在以下位置重新创建它们:

$(.rili _ tab 01 tr:first’)。下一个()。移除();

var retRow= trtd ret[ event time ]/tdtd ret[ event country ]/tdtd ret[ event content ]/TD/tr ;

$(.rili _ tab 01 tr:last’)。之后(retro w);

这个试了一下就能正确显示,第一步只能换一种方式完成。

$(.rili _ tab 01 tr:first ). siblings . remove();

重新创建tr元素将无法正确执行。

也可以改为sibling () $(。rili _ tab 01 tr:first’)。同级()。移除();

发现问题,用错了兄弟姐妹法,正确的在括号里,

$(.rili _ tab 01 tr:first’)。兄弟姐妹()。移除();

var retRow= trtd ret[ event time ]/tdtd ret[ event country ]/tdtd ret[ event content ]/TD/tr ;

$(.rili _ tab 01 tr:last’)。之后(retro w);

以上就是边肖带来的jquery中next和siblings区别的全部内容。希望大家多多支持我们~

浅谈jquery中next与siblings的区别