首页 > 编程语言 >深入学习jquery源码之parent()和parents()与parentsUntil()

深入学习jquery源码之parent()和parents()与parentsUntil()

时间:2023-02-23 22:01:05浏览次数:30  
标签:jquery jQuery parentsUntil parent 元素 elem 源码 dir cur


深入学习jquery源码之parent()和parents()与parentsUntil()

parent([expr])

概述

取得一个包含着所有匹配元素的唯一父元素的元素集合。

你可以使用可选的表达式来筛选。

参数

expr String

用来筛选的表达式

查找每个段落的父元素

<div><p>Hello</p><p>Hello</p></div>
$("p").parent()
[ <div><p>Hello</p><p>Hello</p></div>]

查找段落的父元素中每个类名为selected的父元素。

<div><p>Hello</p></div><div class="selected"><p>Hello Again</p></div>
$("p").parent(".selected")
[ <div class="selected"><p>Hello Again</p></div> ]

 

parents([expr])

概述

取得一个包含着所有匹配元素的祖先元素的元素集合(不包含根元素)。可以通过一个可选的表达式进行筛选。

参数

expr String

用于筛选祖先元素的表达式

找到每个span元素的所有祖先元素。

<html><body><div><p><span>Hello</span></p><span>Hello Again</span></div></body></html>
$("span").parents()

找到每个span的所有是p元素的祖先元素。

$("span").parents("p")

 

parentsUntil([expr|element][,filter])

概述

查找当前元素的所有的父辈元素,直到遇到匹配的那个元素为止。

如果提供的jQuery代表了一组DOM元素,.parentsUntil()方法也能让我们找遍所有元素的祖先元素,直到遇到了一个跟提供的参数匹配的元素的时候才会停下来。这个返回的jQuery对象里包含了下面所有找到的父辈元素,但不包括那个选择器匹配到的元素。

参数

[expr][,filter] String,String

expr: 用于筛选祖先元素的表达式

filter: 一个字符串,其中包含一个选择表达式匹配元素。

[element][,filter] DOMElement,String

element:用于筛选祖先元素的DOM元素

filter: 一个字符串,其中包含一个选择表达式匹配元素。

查找item-a的祖先,但不包括level-1

<ul class="level-1">
<li class="item-i">I</li>
<li class="item-ii">II
<ul class="level-2">
<li class="item-a">A</li>
<li class="item-b">B
<ul class="level-3">
<li class="item-1">1</li>
<li class="item-2">2</li>
<li class="item-3">3</li>
</ul>
</li>
<li class="item-c">C</li>
</ul>
</li>
<li class="item-iii">III</li>
</ul>
$('li.item-a').parentsUntil('.level-1')
.css('background-color', 'red');

 

jquery源码

jQuery.extend({
dir: function (elem, dir, until) {
var matched = [],
cur = elem[dir];

while (cur && cur.nodeType !== 9 && (until === undefined || cur.nodeType !== 1 || !jQuery(cur).is(until))) {
if (cur.nodeType === 1) {
matched.push(cur);
}
cur = cur[dir];
}
return matched;
},
sibling: function (n, elem) {
var r = [];

for (; n; n = n.nextSibling) {
if (n.nodeType === 1 && n !== elem) {
r.push(n);
}
}

return r;
}
});



function sibling(cur, dir) {
do {
cur = cur[dir];
} while (cur && cur.nodeType !== 1);

return cur;
}

jQuery.each({
parent: function (elem) {
var parent = elem.parentNode;
return parent && parent.nodeType !== 11 ? parent : null;
},
parents: function (elem) {
return jQuery.dir(elem, "parentNode");
},
parentsUntil: function (elem, i, until) {
return jQuery.dir(elem, "parentNode", until);
}
}, function (name, fn) {
jQuery.fn[name] = function (until, selector) {
var ret = jQuery.map(this, fn, until);

if (name.slice(-5) !== "Until") {
selector = until;
}

if (selector && typeof selector === "string") {
ret = jQuery.filter(selector, ret);
}

if (this.length > 1) {
// Remove duplicates
if (!guaranteedUnique[name]) {
ret = jQuery.unique(ret);
}

// Reverse order for parents* and prev-derivatives
if (rparentsprev.test(name)) {
ret = ret.reverse();
}
}

return this.pushStack(ret);
};
});

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

标签:jquery,jQuery,parentsUntil,parent,元素,elem,源码,dir,cur
From: https://blog.51cto.com/u_11837698/6081948

相关文章