浅谈jquery中next与siblings的区别

推荐整理分享浅谈jquery中next与siblings的区别，希望有所帮助，仅作参考，欢迎阅读内容。

文章相关热门搜索词:,内容如对您有帮助，希望把文章链接给更多的朋友！

siblings([expr]):

概述

取得一个包含匹配的元素集合中每一个元素的所有唯一同辈元素的元素集合。

[expr] ：可以用可选的表达式进行筛选。用于筛选同辈元素的表达式

示例

找到每个div的所有同辈元素。

HTML 代码:

jQuery 代码:

结果:

找到每个div的所有同辈元素中带有类名为selected的元素。

HTML 代码:

jQuery 代码:

结果:

取得一个包含匹配的元素集合中每一个元素紧邻的后面同辈元素的元素集合。

这个函数只返回后面那个紧邻的同辈元素，而不是后面所有的同辈元素（可以使用nextAll）。可以用一个可选的表达式进行筛选。

示例

描述:

找到每个段落的后面紧邻的同辈元素。

HTML 代码:

jQuery 代码:

结果:

描述:

找到每个段落的后面紧邻的同辈元素中类名为selected的元素。

HTML 代码:

jQuery 代码:

结果:

nextAll([expr])：查找当前元素之后所有的同辈元素。

示例：

描述:

给第一个div之后的所有元素加个类

HTML 代码:

jQuery 代码:

结果:

实际应用案例

删除第一个tr元素后面所有tr，然后在重新创建这些tr：

这是尝试之后能够正确显示的，下面用另一种方式就只能完成第一步$(".rili_tab tr:first").siblings.remove();

重新创建tr元素的将不能正确执行

换成siblings()也是可以的$(".rili_tab tr:first").siblings().remove();

发现问题了，用错了siblings方法了，正确的是加括弧的，