jQuery 查找同胞元素
Posted 乱舞春秋__
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了jQuery 查找同胞元素相关的知识，希望对你有一定的参考价值。
通过 jQuery，我们可以方便的查找某个元素的同胞元素。
1.jQuery siblings( ) 方法：返回被选元素的所有同胞元素。
2.jQuery next( ) 方法：返回被选元素的下一个同胞元素。
3.jQuery nextAll( ) 方法：返回位于被选元素之后的所有同胞元素。
4.jQuery nextUntil( ) 方法：返回位于被选元素后方给定范围内的同胞元素。
5.jQuery prev( )方法：返回被选元素的上一个同胞元素。
6.prevAll( )方法：返回位于被选元素之前的所有同胞元素。
7.prevUntil( ) 方法：返回位于被选元素前方给定范围内的同胞元素。
示例：
搭建如下结构：
<body>
<p class="one">我是段落一。</p>
<p class="two">我是段落二。</p>
<p class="three">我是段落三。</p>
<p class="four">我是段落四。</p>
<p class="five">我是段落五。</p>
<p class="six">我是段落六。</p>
</body>效果图：
以第三个段落为例：
（1）设置所有同胞元素的字体颜色：
$(".three").siblings().css("color","blue");
（2）设置下一个同胞元素的字体颜色：
$(".three").next().css("color","blue");
（3）设置其后面所有同胞元素的字体颜色：
$(".three").nextAll().css("color","blue");
（4）设置位于其后方给定范围内的同胞元素的字体颜色：
$(".three").nextUntil(".six").css("color","blue");
（5）设置其前面第一个同胞元素的字体颜色：
$(".three").prev().css("color","blue");
（6）设置其前面所有同胞元素的字体颜色：
$(".three").prevAll().css("color","blue");
（7）设置位于其前方给定范围内的同胞元素的字体颜色：
$(".three").prevUntil(".one").css("color","blue");
值得一提的是，我们可以对被选元素的同胞元素进行筛选，例如：
$(".three").nextAll(".six").css("color","blue");
以上是关于jQuery 查找同胞元素的主要内容，如果未能解决你的问题，请参考以下文章