Question

考虑这个示例html

<div class="A">
    <div class="B">
        <span class="C">Sample text</span>
        <div class="D">
            <div class="E">Clickable Text</div>
        </div>
    </div>
</div>

还有一些jQuery

$(".E").click(function(){
    //body
});

让$(this)的父级匹配选择器的最简单方法是什么？例如，在示例中我需要获取class="A"的div。目前因为我知道我可以做的HTML的结构

$(this).parent().parent();

但我正在寻找一种无论结构如何都能发挥作用的方法。

的内容

$(this).findFirstParent(".A");

我希望我能理解。

Answer 1

$(".E").click(function(){
    console.log($(this).closest('.A'));
    /* console.log($(this).parents('.A')); works fine too */
});

请参阅
http://api.jquery.com/closest/
http://api.jquery.com/parents/

请注意parent()与parents()方法不同（第一个只查找一个祖先）

Answer 2

第一个解决方案：

$(this).closest('.A')

来源：http://api.jquery.com/closest/ 当遍历匹配选择器时，这将返回第一个父级。

第二个解决方案：

$(this).parents('.A:first')

来源：http://api.jquery.com/parents/ 这将返回与选择器匹配的所有父级

Answer 3

怎么样？

$(this).closest(".A");

Answer 4

这就是我这样做的方式

$(this).parents("div.A")

Answer 5

jQuery父选择器可以帮助你。您可以将它与您要查找的课程相结合。查看文档@ http://api.jquery.com/parent-selector/

找到选择器的第一个父级

5 个答案: