jQuery prev() 方法

prev() 方法用于选择所选元素的紧前同级元素。同级元素是指与另一个元素共享相同父元素的元素。此方法向上遍历 DOM（文档对象模型）并查找之前的同级元素。

prev() 方法只选择紧前同级元素，而不是所有之前的同级元素。要选择所有之前的同级元素，可以使用 prevAll() 方法。

语法

以下是 jQuery 中 prev() 方法的语法：

$(selector).prev(filter)

参数

此方法接受以下可选参数：

filter: 用于筛选之前同级元素的选择器表达式。

示例 1

在下面的示例中，我们使用 traversal() 方法返回 p 元素的紧前同级元素：

<html>
<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
  <script>
    $(document).ready(function(){
        $("p").prev().css({"color": "#40a944", "border": "2px solid #40a944"});
    });
  </script>
</head>
<body>
  <h2>This is heading.</h2>
  <p>Paragraph element.</p>
</body>
</html>

执行上述程序时，将选择 h 元素，因为它是的 p 元素的紧前同级元素。

示例 2

在下面的示例中，我们选择每个 div 元素的紧前同级元素：

<html>
<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
  <script>
    $(document).ready(function(){
        $("div").prev().css({"color": "#40a944", "border": "2px solid #40a944"});
    });
  </script>
</head>
<body>
  <p>Heading element.</p>
  <div>DIV 1</div>
  <p>Paragraph element.</p>
  <p>Paragraph element.</p>
  <div>DIV 2</div>
</body>
</html>

执行上述程序后，div 元素的紧前同级元素将以绿色边框和绿色文本颜色突出显示。

jquery_ref_traversing.htm

打印页面