jQuery遍歷之closest 方法

2021-09-11 23:07:44 字數 751 閱讀 1477

以選定的元素為中心,往內查詢可以通過find、children方法。如果往上查詢,也就是查詢當前元素的父輩祖輩元素,jquery提供了closest()方法,這個方法類似parents但是又有一些細微的區別,屬於使用頻率很高的方法

closest()方法接受乙個匹配元素的選擇器字串

從元素本身開始,在dom 樹上逐級向上級元素匹配,並返回最先匹配的祖先元素

例如:在div元素中,往上查詢所有的li元素,可以這樣表達

$("div").closet("li')
注意:jquery是乙個合集物件,所以通過closest是匹配合集中每乙個元素的祖先元素

closest()方法給定的jquery集合或元素來過濾元素

同樣的也是因為jquery是合集物件,可能需要對這個合集物件進行一定的篩選,找出目標元素,所以允許傳乙個jquery的物件

注意事項:在使用的時候需要特別注意下

粗看.parents()和.closest()是有點相似的,都是往上遍歷祖輩元素,但是兩者還是有區別的,否則就沒有存在的意義了

起始位置不同:.closest開始於當前元素 .parents開始于父元素

遍歷的目標不同:.closest要找到指定的目標,.parents遍歷到文件根元素,closest向上查詢,直到找到乙個匹配的就停止查詢,parents一直查詢到根元素,並將匹配的元素加入集合

結果不同:.closest返回的是包含零個或乙個元素的jquery物件,parents返回的是包含零個或乙個或多個元素的jquery物件

如何理解與簡化jquery的closest函式

在實現delegate方法中,有乙個很重要的輔助函式叫closest,雖然現在它歸類為遍歷節點這個模組中。這個函式實現得非常複雜,洋洋灑灑近50行,完全不符合極限程式設計的規矩。closest function selectors,context level 1 if cur selectors.l...

Jquery之DOM節點遍歷

html dom 是將乙個html文件當做樹結構,樹有根枝葉,html文件也有根枝葉,這些根枝葉,都可以叫做乙個個的節點,即dom節點 要對html進行操作,也就是對html 的dom節點進行操作,要操作,首先就是要找到進行操作的節點,其中一種方法就是用jquery的選擇器 基本選擇器,層次選擇器,...

jquery 遍歷 之 end 方法

1.end 比如要查詢 first 下的 class 為 foo 的元素 並 將其color設定為red。通常如果我們接著往下寫 ul.first find foo css color red find bar css color red 那麼 沒有什麼效果,如果我們改成 ul.first find...