jquery中的parent和parents方法

注: 我使用的版本是2.2.4.

parent方法是获取当前节点的直接父节点, 而parents方法是获取当前节点的所有祖先节点.

其实并不难理解, 一看源码就知道了.

jQuery.each( {
parent: function( elem ) {
var parent = elem.parentNode;
return parent && parent.nodeType !== 11 ? parent : null;
},
parents: function( elem ) {
return dir( elem, "parentNode" );
}
// ... 其他方法
);

其实parent方法用的就是原生的parentNode属性来获取的(nodeType为11的节点类型是DocumentFragment).

对于parents方法又调用了dir方法, 我们继续看:

var dir = function( elem, dir, until ) {
var matched = [],
truncate = until !== undefined;

while ( ( elem = elem[ dir ] ) && elem.nodeType !== 9 ) {
if ( elem.nodeType === 1 ) {
if ( truncate && jQuery( elem ).is( until ) ) {
break;
}
matched.push( elem );
}
}
return matched;
};

已经很清楚了, parents方法用的是原生的parentNode, 并一直循环到document为止, 并且全部都是元素节点(

elem.nodeType === 1

), 返回的是一个数组, 而parent方法返回的是一个对象.