jQuery parent()、parent() 和closest() 函数之间的区别
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9193212/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Difference between jQuery parent(), parents() and closest() functions
提问by Sajjan Gurung
I have been using jQuery for a while. I wanted to use the parent()selector. I also came up with the closest()selector. Could not find any difference between them. Is there any? If yes, what?
我已经使用 jQuery 一段时间了。我想使用parent()选择器。我也想出了closest()选择器。找不到它们之间的任何区别。有没有？如果是，是什么？
What is the difference between parent(), parents()and closest()?
之间有什么区别parent()，parents()和closest()？
采纳答案by Subash
closest()selects the first element that matches the selector, up from the DOM tree. Begins from the current element and travels up.
parent()selects one element up (single level up) the DOM tree.
parents()method is similar toparent()but selects all the matching elements up the DOM tree. Begins from the parent element and travels up.
closest()选择与选择器匹配的第一个元素，从 DOM 树向上。从当前元素开始向上移动。
parent()在 DOM 树中向上选择一个元素（单级向上）。
回答by Naveed
from http://api.jquery.com/closest/
来自http://api.jquery.com/closest/
The .parents()and .closest()methods are similar in that they both traverse up the DOM tree. The differences between the two, though subtle, are significant:
.closest()
- Begins with the current element
- Travels up the DOM tree until it finds a match for the supplied selector
- The returned jQuery object contains zero or one element
.parents()
- Begins with the parent element
- Travels up the DOM tree to the document's root element, adding each ancestor element to a temporary collection; it then filters that collection based on a selector if one is supplied
- The returned jQuery object contains zero, one, or multiple elements
.parent()
- Given a jQuery object that represents a set of DOM elements, the .parent() method allows us to search through the parents of these elements in the DOM tree and construct a new jQuery object from the matching elements.
Note:The .parents() and .parent() methods are similar, except that the latter only travels a single level up the DOM tree. Also, $("html").parent() method returns a set containing document whereas $("html").parents() returns an empty set.
的。家长（）和.closest（）方法是类似的，它们都向上遍历DOM树。两者之间的差异虽然细微，但很重要：
.closest()
- 从当前元素开始
- 沿着 DOM 树向上移动，直到找到与提供的选择器相匹配的
- 返回的 jQuery 对象包含零个或一个元素
。父母（）
- 从父元素开始
- 沿着 DOM 树向上移动到文档的根元素，将每个祖先元素添加到一个临时集合中；然后，如果提供了选择器，则它会根据选择器过滤该集合
- 返回的 jQuery 对象包含零个、一个或多个元素
.父母（）
- 给定一个表示一组 DOM 元素的 jQuery 对象，.parent() 方法允许我们在 DOM 树中搜索这些元素的父元素，并从匹配的元素中构造一个新的 jQuery 对象。
注意：.parents() 和 .parent() 方法是相似的，除了后者只在 DOM 树中向上移动一层。此外， $("html").parent() 方法返回一个包含文档的集合，而 $("html").parents() 返回一个空集合。
Here are related threads:
以下是相关主题：
回答by antyrat
The differences between the two, though subtle, are significant:
两者之间的差异虽然细微，但很重要：
- Begins with the current element
- Travels up the DOM tree until it finds a match for the supplied selector
- The returned jQuery object contains zero or one element
- Begins with the parent element
- Travels up the DOM tree to the document's root element, adding each ancestor element to a temporary collection; it then filters that collection based on a selector if one is supplied
- The returned jQuery object contains zero, one, or multiple elements
- 从当前元素开始
- 沿着 DOM 树向上移动，直到找到与提供的选择器相匹配的
- 返回的 jQuery 对象包含零个或一个元素
- 从父元素开始
- 沿着 DOM 树向上移动到文档的根元素，将每个祖先元素添加到一个临时集合中；然后，如果提供了选择器，则它会根据选择器过滤该集合
- 返回的 jQuery 对象包含零个、一个或多个元素
From jQuery docs
来自 jQuery文档
回答by Imran Kabir
There is difference between both $(this).closest('div')and $(this).parents('div').eq(0)
$(this).closest('div')和之间有区别$(this).parents('div').eq(0)
Basically closeststart matching element from the current element whereas parentsstart matching elements from parent (one level above the current element)
基本上closest从当前元素parents开始匹配元素，而从父元素开始匹配元素（当前元素上一级）
See http://jsfiddle.net/imrankabir/c1jhocre/1/
回答by hsuk
$(this).closest('div')is same as $(this).parents('div').eq(0).
$(this).closest('div')与 相同$(this).parents('div').eq(0)。
