JQ7 元素的遍历查找

/ 0评 / 0

取得一个包含匹配的元素集合中每一个元素的所有元素的元素集合。(向下遍历一个子元素)

children([expr])
得到当前匹配的元素集合中每个元素的后代。(遍历所有后代)
find(expr)
从元素本身开始,在DOM 树上逐级向上级元素匹配,并返回第一个匹配的祖先元素。
closest([expr])

取得一个包含匹配的元素集合中每一个元素的所有同辈元素的元素集合。可以用可选的表达式进行筛选。

siblings([expr])
 
 
 
 
 
 
取得匹配的元素集合中每一个元素紧邻的前面第一个同辈元素的元素集合。
prev([expr])
取得匹配的元素集合中每一个元素紧邻的前面所有同辈元素的元素集合。
prevAll([expr])
通过选择器,DOM节点,或jQuery对象得到每个元素之前的所有兄弟元素,但不包括匹配的元素
prevUntil([expr])
取得匹配的元素集合中每一个元素紧邻的后面第一个同辈元素的元素集合。
如果提供一个选择器,那么只有紧跟着的兄弟元素满足选择器时,才会返回此元素。
next([expr])
取得匹配的元素集合中每一个元素紧邻的后面所有同辈元素的元素集合。
nextAll([expr])
 
 
通过选择器,DOM节点,或jQuery对象得到每个元素之的所有兄弟元素,但不包括匹配的元素
nextUntil([expr])

查找 <dt id="term-2"> 之后的所有兄弟元素,直到遇到 <dt> 为止,并将他们的背景色设为红色。

查找 <dt id="term-1"> 之后,<dd>的所有兄弟元素,直到遇到 <dt id="term-3"> 为止,并将他们的文字颜色设为绿色。

<dl>
<dt id="term-1">term 1</dt>
<dd>definition 1-a</dd>
<dd>definition 1-b</dd>
<dd>definition 1-c</dd>
<dd>definition 1-d</dd>
<dt id="term-2">term 2</dt>
<dd>definition 2-a</dd>
<dd>definition 2-b</dd>
<dd>definition 2-c</dd>
<dt id="term-3">term 3</dt>
<dd>definition 3-a</dd>
<dd>definition 3-b</dd>
</dl>
<script>
$("#term-2").nextUntil("dt").css("background-color", "red");
var term3 = document.getElementById("term-3");
$("#term-1").nextUntil(term3, "dd") .css("color", "green");
</script>
clipboard-1
offsetParent()
parent([expr])
$('li').parent().css('background', '#ccc'); //选择当前元素的父元素
parents([expr])
$('li').parents().css('background', '#ccc'); //选择当前元素的父元素及祖先元素
parentsUntil([expr])
$('li').parentsUntil('div').css('background', '#ccc'); //选择当前元素遇到div 父元素停止

发表评论

电子邮件地址不会被公开。 必填项已用*标注