juery遍历节点之prevAll()方法

JQuery

1个成员

juery遍历节点之prevAll()方法

发表于 2017-01-21 • 3117 次查看

前面我们讲到了prev()方法的使用方法，下面我来接着来介绍在prevAll()方法遍历节点的方法，有需要了解的同学可参考。

prevAll()方法

.prevAll([selector])

此方法取得每个匹配的元素的前面的所有同辈元素的元素集合。
可以用一个可选的表达式在前面的所有同辈元素中进行筛选。

下面来看实例：
HTML代码：

代码如下

复制代码

$('li.item').prevAll().css('background-color', 'red');

//prevAll中的字母A必须要大写哦~不然会报错的

结果是两个ul中的<li>li 1</li>和<li>li 2</li>的背景都会变成红色。

代码如下

复制代码

<ul>
    <li>jquery 1</li>
    <li>php 2</li>
    <li class="item">css 3</li>
    <li>java 4</li>
</ul>
<ul>
    <li>jquery 1</li>
    <li>php 2</li>
    <li class="item">css 3</li>
    <li>java 4</li>
</ul>
<input id="test" type="button" value="获取class为'item'的li的前面的所有的li元素" /> <script>
$("#test").click(function(){
$('li.item').prevAll().css('background-color', 'red');
})
</script>

再来看一个.prevAll([selector])带参数的用法

代码如下	复制代码
<div class="selected"><span>jquery</span></div> <div><span>PHP</span></div> <div>CSS</div> <p>都是相当给力的技术</p> <script> $("p").prevAll(".selected").css("background", "yellow"); </script>