如何查找包含特定選擇器的父元素

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');