jQuery DOM遍历
2019-06-27 本文已影响0人
头脑之外
jQuery 祖先:
parent(); // 返回被选元素的直接父元素
parents(); // 返回被选元素的所有祖先元素,它一路向上直到文档的根元素 (<html>)
parentsUntil(); // 返回被选元素之间的所有祖先元素
<script>
// 对span与div之间的祖先元素设置样式为red
$("span").parentsUntil("div").css({"color":"red"});
</script>
<div>
<ul>
<li>hi,sina</li>
</ul>
<span>hi,snackpub</span>
</div>
jQuery 同胞:
siblings(); // 所有同级元素
next(); // 下一个同胞元素
nextAll(); //
nextUntil(); // 两个给定元素之间的所有同胞元素
<script>
$("h1").nextUntil("h6").css("color","red");
</script>
<h1> </h1>
<h2> </h2>
<h3> </h3>
<h4> </h4>
<h5> </h5>
<h6> </h6>
jQuery 后代:
children(); // 返回被选元素的所有直接子元素
find(); // 返回被选元素的后代元素,一路向下直到最后一个后代
$("#div").nextAll("span").remove();/* 对div标签下所有span同胞标签进行移除 */
$("#div").next("span").children("i").css({color: "#f56c6c"});/* 对div标签下的第一个span标签的后代i标签增加样式 */