jquery获取上一个元素
获取上一个兄弟元素的方法
使用 prev() 方法可以获取当前元素的上一个兄弟元素(即前一个同级元素)。
$("#currentElement").prev();
示例:
<div class="container">
<div id="first">第一个元素</div>
<div id="second">第二个元素</div>
<div id="third">第三个元素</div>
</div>
// 获取 #second 的上一个元素(即 #first)
$("#second").prev().css("color", "red");
获取上一个符合条件的兄弟元素
如果需要筛选特定条件的上一个兄弟元素,可以传递选择器参数给 prev()。
$("#currentElement").prev(".filter-class");
示例:
<ul>
<li>Item 1</li>
<li class="highlight">Item 2</li>
<li>Item 3</li>
<li class="highlight">Item 4</li>
</ul>
// 获取最后一个 .highlight 的上一个 .highlight 元素
$(".highlight").last().prev(".highlight").css("font-weight", "bold");
获取所有上一个兄弟元素
使用 prevAll() 可以获取当前元素之前的所有兄弟元素。
$("#currentElement").prevAll();
示例:
// 获取 #third 之前的所有兄弟元素并隐藏
$("#third").prevAll().hide();
获取上一个元素直到某个条件
prevUntil() 方法可以获取当前元素之前的所有兄弟元素,直到遇到匹配选择器的元素为止。
$("#currentElement").prevUntil(".stop-element");
示例:
<div class="container">
<div class="header">Header</div>
<div>Content 1</div>
<div>Content 2</div>
<div class="footer">Footer</div>
</div>
// 获取 .footer 之前的所有元素,直到 .header
$(".footer").prevUntil(".header").css("background", "yellow");
注意事项
- 如果目标元素没有上一个兄弟元素,
prev()返回空的 jQuery 对象。 - 结合
eq()可以进一步筛选特定位置的兄弟元素,例如$("#element").prevAll().eq(0)获取紧邻的上一个元素。







