上两篇的博文分别记录了,如何获取一个元素一的所有子元素,和如何获取某个指定元素的相邻同辈的上一个元素和下一个元素,今天记录一下JQuery中如何获取同辈元素中的所有元素

jQuery 遍历 - siblings() 方法

jQuery中的siblings方法可以获取指定元素的同辈的所有元素,返回一个数组

语法

.siblings(selector)

注:selector为可选项,包含用于匹配元素的选择器表达式。

siblings()方法使用案例

获取UL标签同辈的所有元素,并输出获取的个数,并把它们的字体设为红色

jQuery 遍历 - siblings() 方法

HTML代码

<div>我是一个DIV标签</div>
<ul class="mochu">
    <li>我是第一个li标签</li>
    <li>我是绿色的字体</li>
</ul>
<p>我是一个段落</p>
<p>我是一个段落</p>

JQ代码

var $element = $(".mochu").siblings();//获取元素,为数组
$element.css("color","red");//赋予样式
alert($element.length);//输入数组长度

结果如下图所示

QQ截图20180129204351.png

PS:上边代码中的<script>也算作一个元素,所以会出现四个元素的长度