jq查找父类元素三个函数的区别
parent()、parents()与closest()方法两两之间有类似又有不同，本篇简短的区分一下这三个方法。通过本篇内容，大家将会在以后使用.parent()、parents()和closest()时不会显得无从下手。
我们直接看例子来来说明一下这三个方法的使用区别：
<ul id="menu" style="width:100px;">
<li>
<ul>
<li>
<a href="#">Home</a>
</li>
</ul>
</li>
<li>
End
</li>
</ul>接下来，分别看看这三个方法：
//点击Home时
$("#menu a").click(function() {
$(this).parent("ul").css("background", "yellow"); //0
$(this).parent("li").parent("ul").css("background", "yellow"); //1
$(this).parents("ul").css("background", "yellow"); //2
$(this).closest("ul").css("background", "yellow"); //3
return false; }); 1.parent()方法从指定类型的直接父节点开始查找，在"0"中，<a>的直接父节点是<li>所以在这里找不到<ul>父节点。在"2"中先找到了<li>，接着找到<ul>，并将它的背景色设置为yellow。parent()返回一个节点。
2.parents()方法查找方式同parent()方法类似，不同的一点在于，当它找到第一的父节点时并没有停止查找，而是继续查找，最后返回多个父节点，如在"2"中，使得id为menu的ul整个背景色变成了yellow。
3.closest()方法查找时从包含自身的节点找起，它同parents()很类似，不同点就在于它只返回一个节点如在"3"中，实现的功能同1相同。但它使得代码量减小，同"2"相比又只返回单一的一个节点。可见，closest()方法在项目中的使用频率是比较大的。
但是注意一点:
看jQuery官方的解释:
closest(expr,[context]|object|element)
概述
jQuery 1.3新增。从元素本身开始，逐级向上级元素匹配，并返回最先匹配的元素。。
closest会首先检查当前元素是否匹配，如果匹配则直接返回元素本身。如果不匹配则向上查找父元素，一层一层往上，直到找到匹配选择器的元素。如果什么都没找到则返回一个空的jQuery对象。
closest和parents的主要区别是：1，前者从当前元素开始匹配寻找，后者从父元素开始匹配寻找；2，前者逐级向上查找，直到发现匹配的元素后就停止了，后者一直向上查找直到根元素，然后把这些元素放进一个临时集合中，再用给定的选择器表达式去过滤；3，前者返回0或1个元素，后者可能包含0个，1个，或者多个元素。
closest对于处理事件委托非常有用。
这里parents()方法虽然是将查询到的元素都放在 了一个临时集合中, 但是它并不是按照正常Dom结构放的, 而是按照查询的顺序放到临时容器中的, 相当于是原始文档的倒序放置方式. 注意: 这里倒序的意思是说: 元素的存放位置是倒序的, 例如: :first:, :last 等存放的顺序是倒序的.
因为closest() 函数逐级向上查找，直到发现匹配的元素后就停止了, 因此它不支持 过滤选择器 tr:first 等选择器, 而 parents() 是要从多个元素中选择出来一个适合的, 因此它可以使用过滤选择器.
例如:
$(this).closest("tr").remove();
$(this).parents("tr:first").remove();
总结：
1.parent:只看一个父级，合适就合适，不合适就算了。
2.parents:从父类开始，逐级往上查，把所有合适条件的放在一个集合。
3.closest:从自身开始，逐级往上找，遇到合适的就停止。
转自：http://blog.csdn.net/java85140031/article/details/19403253
