zoukankan      html  css  js  c++  java
  • JQuery学习之遍历

    1.祖先:向上遍历DOM树

    **parent():返回被选中元素的直接父元素,该方法只会向上一级对DOM树进行遍历

    $(document).ready(function(){

      $("span").parent();

    });

    **parents():返回被选元素的所有祖先元素,它一路向上直到文档的根元素(<html>)

    $(document).ready(function(){

      $("span").parents();

    });

    **parents():这个方法也可以使用可选参数来过滤对祖先元素的搜索

    $(document).ready(function(){

      $("span").parents("ul");

    });

    **parentsUntil():返回介于两个给定元素之间的所有祖先元素

    $(document).ready(function(){

      $("span").parentsUntil("div");

    });

    2.后代:向下遍历DOM树

    **children():返回被选元素的所有子元素,该方法只会向下一级对DOM树进行遍历

    $(document).ready(function(){

      $("div").children();

    });

    **children():也可以使用可选参数来过滤对子元素的搜索

    $(document).ready(function(){

      $("div").children("p.1");

    });

    **find():返回被选元素的后代元素,一路向下直到最后一个后代

    $(document).ready(function(){

      $("div").find("*");                //返回<div>的所有后代

      $("div").find("span");            //返回属于<div>后代的所有<span>元素

    });

    3.同胞:在DOM树进行水平遍历

    **siblings()方法:返回被选元素的所有同胞元素

    $(document).ready(function(){

      $("h2").siblings();            //返回<h2>的所有同胞元素

      $("h2").siblings("p");       //返回属于<h2>的同胞元素的所有<p>元素  

    });

    **next()方法:返回被选元素的下一个同胞元素

    $(document).ready(function(){

      $("h2").next();

    });

    **nextAll()方法:返回被选元素的所有跟随的同胞元素

    $(document).ready(function(){

      $("h2").nextAll();

    });

    **nextUntil()方法:返回介于两个给定参数之间的所有跟随的同胞元素

    $(document).ready(function(){

      $("h2").nextUntil("h6");             //返回介于两个参数之间的所有跟随的同胞元素

    });

    **prev(),prevAll()以及prevUntil()方法的工作方式与上面的方法类似,只不过方向相反而已,它返回的是前面的同胞元素

    4.过滤:缩写搜索元素的范围;

    **first():返回被选元素的首个元素

    $(document).ready(function{

      $("div p").last();                 //选择最后一<div>元素中的最后一个<p>元素

    });

    **eq():返回被选元素中带有指定索引号的元素,索引号从0开始而不是1.

    $(document).ready(function(){

      $("p").eq(1);

    });

    **filter():允许你规定一个标准;不匹配这个标准的元素会被从集合中删除,匹配的元素会被返回

    $(document).ready(function(){

      $("p").filter(".url");              //返回带有类名"url"的所有<p>元素

    });

    **not():返回不匹配标准的所有元素,与filter()方法相反

    $(document).ready(function(){

      $("p").not(".url");

    });

  • 相关阅读:
    Android实现资料收藏
    GPS(Global Positioning System)全球定位系统
    Android开发环境搭建全程演示(jdk+eclipse+android sdk)
    ADT在线安装
    简洁判断一个byte中有多少位为1的bit?
    tomcat部署java项目
    centos7把编译安装的服务通过systemctl管理
    ansible自动化部署
    redi通过哨兵sentinel实现主从切换
    redis实现集群加主从复制
  • 原文地址:https://www.cnblogs.com/hqutcy/p/5974744.html
Copyright © 2011-2022 走看看