jQuery DOM遍历

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标签增加样式 */
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • jQuery 遍历 什么是遍历?jQuery 遍历,意为“移动”,用于根据其相对于其他元素的关系来“查找”(或选取...
    鹿守心畔光阅读 403评论 0 6
  • jQuery 遍历 一 jQuery 遍历 - 祖先 通过 jQuery,您能够向上遍历 DOM 树,以查找元素的...
    垃圾桶边的狗阅读 3,896评论 0 1
  • jQuery 遍历,意为“移动”,用于根据其相对于其他元素的关系来“查找”(或选取)HTML 元素。以某项选择开始...
    赵一矛阅读 344评论 0 1
  • 1.jQuery parent() 方法 parent() 方法返回被选元素的直接父元素。 该方法只会向上一级对 ...
    WANG_M阅读 198评论 0 1
  • jQuery append() 方法 append() 方法在 被选元素内部的结尾插入指定内容。提示:append...
    吧啦啦小汤圆阅读 1,621评论 1 2