当前位置:首页 > jquery

jquery获取上一个元素

2026-02-04 06:16:22jquery

获取上一个兄弟元素的方法

使用 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) 获取紧邻的上一个元素。

jquery获取上一个元素

标签: 元素jquery
分享给朋友:

相关文章

jquery官网

jquery官网

jQuery 官网地址 jQuery 的官方网站是 https://jquery.com/。该网站提供以下核心内容: 下载 jQuery:提供最新版本的 jQuery 库(压缩版和未压缩版),支持直…

jquery 菜鸟

jquery 菜鸟

以下是针对 jQuery 初学者的基础指南,涵盖核心概念和常用操作: jQuery 简介 jQuery 是一个快速、轻量级的 JavaScript 库,简化了 HTML 文档遍历、事件处理、动画和…

jquery版本

jquery版本

jQuery 的版本历史及当前状态如下: 当前稳定版本 jQuery 的最新稳定版本是 3.6.4(发布于 2023 年 3 月),支持现代浏览器并修复了部分安全问题。 主要版本分支 j…

jquery 筛选器

jquery 筛选器

jQuery 筛选器 jQuery 筛选器用于从一组匹配的元素中进一步筛选出符合条件的子集。这些筛选器可以基于元素的位置、内容、属性或状态进行筛选。 基本筛选器 :first 选择第一个匹配的元素…

jquery获取

jquery获取

获取元素 使用jQuery选择器获取元素,通过CSS选择器或jQuery特定选择器定位目标元素。常见选择器包括ID选择器(#id)、类选择器(.class)、标签选择器(tag)等。示例: $('…

jquery 对象

jquery 对象

jQuery 对象简介 jQuery 对象是通过 jQuery 选择器或方法创建的封装了 DOM 元素的集合。它是一个类数组对象,包含一组 DOM 元素并提供 jQuery 特有的方法链式操作。…