[jQuery][轉] [jQuery] .parent() 與 .parents() 與 .closest() 的差異－碎碎念

轉自 http://seanphpbook.blogspot.com/2015/04/jquery-parent-parents-closest.html

parent() 只往上查找一層
closest() 往上查找只要找到符合條件的就停止
parents() 往上查找不停止找出所有符合條件的

用 w3 官網案例程式來看：連結

改成這樣就知道差異了

<div class="selected">
123
<div class="selected">
<div>
<p>Hello Again</p>
</div>
</div>
</div>

如果是 .parent()
$("p").parent(".selected").css("background", "yellow");
會發現沒有變色

如果是 .closest()
$("p").closest(".selected").css("background", "yellow");
會發現 123 沒有變色但 Hello Again 變色了

如果是 .parents()
$("p").parents(".selected").css("background", "yellow");
會發現 123 跟 Hello Again 都變色了

結論：
parent() 只往上查找一層
closest() 往上查找只要找到符合條件的就停止
parents() 往上查找不停止找出所有符合條件的