如何查找包含特定选择器的父元素

Question

让我们假设具有以下html结构（1）。
从$('.child') element我可以访问$('.gran-parent') element制作类似$('.child').parent().parent();。

无论如何，我不认为这是一个好方法，因为它不是通用的。
假设$（'。gran-parent'）和$（'。child'）之间还有其他div。
从$('.child')开始，引用第一个父类gran-parent的最通用方法是什么？

<div class='gran-parent'> 
    <div class='parent'> 
     <div class='child'> 
     </div> 
    </div> 
</div> 

Answer 1

你想：

$('.child').closest(".grand-parent"); 

.closest将继续向上遍历，直到找到一个.grand-parent。你也可以做.parents(".grand-parent")但可能返回不止一个结果，这取决于你的DOM层次，所以你要做的：

.parents(".grand-parent").eq(0) 

或：

.parents(".grand-parent").slice(0) 

或：

.parents(".grand-parent:first") 

所有这些都不如.closest()优雅。

请参见：

• http://api.jquery.com/closest/
• http://api.jquery.com/parents/

Answer 2

您正在寻找的.parents()操作。

实施例：

$('.child').parents('.gran-parent');