首頁 >web前端 >js教程 >jQuery 遍歷- 關於closest() 的方法介紹以及與parents()的方法區別分析_jquery

jQuery 遍歷- 關於closest() 的方法介紹以及與parents()的方法區別分析_jquery

WBOY
WBOY原創
2016-05-16 17:35:101539瀏覽

closest() 方法获得匹配选择器的第一个祖先元素从当前元素开始沿 DOM 树向上。

语法:

.closest(selector)

参数selector为字符串值,包含匹配元素的选择器表达式。

如果给定表示 DOM 元素集合的 jQuery 对象,.closest() 方法允许我们检索 DOM 树中的这些元素以及它们的祖先元素,并用匹配元素构造新的 jQuery 对象。.parents() 和 .closest() 方法类似,它们都沿 DOM 树向上遍历。两者之间的差异尽管微妙,却很重要:

.closest() .parents()
从当前元素开始 从父元素开始
沿 DOM 树向上遍历,直到找到已应用选择器的一个匹配为止。 沿 DOM 树向上遍历,直到文档的根元素为止,将每个祖先元素添加到一个临时的集合;如果应用了选择器,则会基于该选择器对这个集合进行筛选。 
返回包含零个或一个元素的 jQuery 对象 返回包含零个、一个或多个元素的 jQuery 对象

先看下面的範例:示範如何透過 closest() 完成事件委託。當被最接近的列表元素或其子後代元素被點擊時,會切換黃色背景
複製代碼 代碼如下: