jquery获取父节点的两种方法(parent、parents或closest)
在使用jquery时,有时要获取当前节点的父节点,包括直接父节点和祖先父节点。
方法一,parent([expr])和parents([expr])。
从方法的名字上就可以判断前一个方法是单数,也就是返回一个真正的父节点,后面是返回所有的祖先节点集合(不包含根节点)。
假设需要获取当前节点的祖父节点(父节点的父节点),其有属性class=”pp”,那么获取的方法为:
上述操作在理想情况下,都没有问题。例如后来修改页面,在当前节点上又加了一个父节点,那么前两种获取的到的节点就不是当初节点;
另外如果其祖先节点中还有属性class=”pp” 的节点,第三种获取的节点也不是自己想要的。
方法二,另一个获取父节点的方法closest([expr])。
closest首先检查当前元素是否匹配,如果匹配则直接返回元素本身。
如果不匹配则向上查找父元素,一层一层往上,直到找到匹配选择器的元素。否则返回一个空的jquery对象。
使用上述操作获取含义特定属性的祖父节点相对要安全一些,即使在当前节点和祖父节点中增加或者减少节点,只要增加的节点没有相同的属性,已有的js代码可能都不需要进行修改。
closest和parents的主要区别:
1、前者从当前元素开始匹配寻找,后者从父元素开始匹配寻找。
2、前者逐级向上查找,直到发现匹配的元素后 就停止了,后者一直向上查找直到根元素,然后把这些元素放进一个临时集合中,再用给定的选择器表达式去过滤。
2、前者返回0或1个元素,后者可能包含0 个,1个,或者多个元素。