首页 > 代码库 > jQuery中的closest()和parents()的差别

jQuery中的closest()和parents()的差别

jQuery中的closest()和parents()的差别

jQuery中closest()和parents()的作用非常类似,都是向上寻找符合选择器条件的元素,可是他们之间有一些细微的差别,官网也给出了说明:


.closest() .parents()
Begins with the current element Begins with the parent element
Travels up the DOM tree until it finds a match for the supplied selector 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 or one element for each element in the original set, in document order The returned jQuery object contains zero or more elements for each element in the original set, in reverse document order

以上介绍的非常清楚,closest()从当前元素開始找,找到一个符合条件的对象后就返回,而parents()则是从父元素開始向上找,一直到文档根节点。返回全部符合条件的jQuery元素对象。

<script type="text/javascript"> $(function () { $(‘pre.prettyprint code‘).each(function () { var lines = $(this).text().split(‘\n‘).length; var $numbering = $(‘
    ‘).addClass(‘pre-numbering‘).hide(); $(this).addClass(‘has-numbering‘).parent().append($numbering); for (i = 1; i <= lines; i++) { $numbering.append($(‘
  • ‘).text(i)); }; $numbering.fadeIn(1700); }); }); </script>

jQuery中的closest()和parents()的差别