1.find():获得当前元素中每个元素的后代,通过选择器、jQuery对象或元素筛选。
例如:
$("p").find("span").css('color','red');//<p>标签下的<span>标签字体颜色为红色。
2.next():获得匹配元素集合中每个元素紧邻的同胞元素。如果提供选择器,则取回匹配该选择器的下一个同胞元素。
例如1:
<body>
<p>Hello</p>
<p class="selected">Hello Again</p>
<div><span>And Again</span></div>
<p>World</p>
</body>
在其中添加next()方法:
(1) $("p").next(".selected").css("background", "yellow");
结果为:“Hello Again”背景色为黄色。
分析:所有<p>标签的紧邻同胞(p)的带有selected的选择器的元素。
(2) $("p").next().css("background", "yellow");
结果为:除了第一个其他”背景色为黄色。
分析:所有<p>标签的紧邻的元素。
(3) $("p.selected").next().css("background", "yellow");
结果为:"And Again"背景色为黄色。
分析:带有selected选择器<p>标签的紧邻元素。
注意:匹配的所有元素。返回所有元素的紧邻(指一个)同胞(不一定是一样的标签)。
3.siblings() :获得匹配集合中每个元素的同胞。
去掉了“紧邻”,则获得所有同胞元素。
4.parent(): 获得当前匹配元素集合中每个元素的父元素,使用选择器进行筛选是可选的。
例如:
<body>
<div><p selected>Hello</p></div>
<div class="selected">
<span>hi</span>
<div class="se">
<p>Hello Again</p>
</div>
</div>
<script>
$("p").parent(".selected").css("background", "yellow");
</script>
结果:没有元素有背景色。
分析:先获得<p>所有的元素,获得他们的父元素(一个元素的父元素只有一个),再通过选择器来在这些中选择。
5.closeset():获得匹配选择器的第一个祖先元素,从当前元素开始沿 DOM 树向上。参数为:element或者selector。