如何获取具有特定元素的上一个元素

How to get previous element which has a specific element?

本文关键字：元素 上一个 何获取 获取      更新时间：2023-09-26

我需要为包含特定元素的上一个元素选择元素。很难理解，让我这样解释吧。

HTML（DOM）：

<div><a></a></div>
<div><p class="selectThis"></p></div> ------
                                           -
<div><a></a></div>                         - select from previous element which holds class
                                           -
<div><p class="fromThis"></p></div> --------

我以前尝试过的：

 $('.fromThis').parent().prev(); //

这不是最漂亮的，但它选择了元素并添加了一个类

jQuery解决方案

$("a").on("click", function(event) {
       event.preventDefault();
      $(this).parent().prevAll().find(".selectThis").css({"background": "gold"});
    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div><a></a></div>
<div><p class="selectThis">This is a paragraph</p></div> 
<div><a href="www.google.com">Select previous class</a></div>                        
<div><p class="fromThis"></p></div>

当你点击链接时，默认行为是打开一个新的选项卡。为了防止这种情况，我们可以调用preventDefault操作。

要找到类为selectThis的div，我们向上遍历以找到父元素，向后遍历以找到其同级元素。要查找兄弟姐妹的子女，我们使用find()方法。

您可以进行

 $('.fromThis').parent().prevAll().find('.selectThis');

从div的级别中，您将选择该级别上以前的所有兄弟（即其他div）。然后选择具有selectThis类的div的所有后代。因此，它不仅必须选择一个元素或最接近fromThis的元素，而且如果有更多的元素，则必须选择一整套元素。

如果只选择最接近原始元素的元素是很重要的，那么必须扩展如下表达式：

 $('.fromThis').parent().prevAll().find('.selectThis').last();

我的解决方案是：找到第一个父级，然后找到所有兄弟级，因此筛选类：

$('.fromThis').parent().siblings().find('.selectThis')
相关文章：