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");

});

JQuery学习之遍历的更多相关文章

  1. 第二十六篇 jQuery 学习8 遍历-父亲兄弟子孙元素

    jQuery 学习8 遍历-父亲兄弟子孙元素   jQuery遍历,可以理解为“移动”,使用“移动”还获取其他的元素.   什么意思呢?老师举一个例子: 班上30位同学,我是新来负责教这个班学生的老师 ...

  2. jQuery 学习04——遍历:定义、向上、向下、同级、过滤

    Query 遍历,意为"移动",用于根据其相对于其他元素的关系来"查找"(或选取)HTML 元素. 以某项选择开始,并沿着这个选择移动,直到抵达您期望的元素为止 ...

  3. jquery 学习(三) - 遍历操作

    HTML代码 <p>1111</p> <p>1111</p> <p>1111</p> <p>1111</p&g ...

  4. jQuery 学习笔记

    jQuery 学习笔记   一.jQuery概述    宗旨: Write Less, Do More.    基础知识:        1.符号$代替document.getElementById( ...

  5. jQuery学习笔记(一):入门

      jQuery学习笔记(一):入门 一.JQuery是什么 JQuery是什么?始终是萦绕在我心中的一个问题: 借鉴网上同学们的总结,可以从以下几个方面观察. 不使用JQuery时获取DOM文本的操 ...

  6. jQuery学习笔记 - 基础知识扫盲入门篇

    jQuery学习笔记 - 基础知识扫盲入门篇 2013-06-16 18:42 by 全新时代, 11 阅读, 0 评论, 收藏, 编辑 1.为什么要使用jQuery? 提供了强大的功能函数解决浏览器 ...

  7. jQuery学习笔记之jQuery的Ajax(3)

    jQuery学习笔记之jQuery的Ajax(3) 6.jQuery的Ajax插件 源码地址: https://github.com/iyun/jQueryDemo.git ------------- ...

  8. jQuery学习笔记之DOM操作、事件绑定(2)

    jQuery学习笔记之DOM操作.事件绑定(2) --------------------学习目录------------------------ 4.DOM操作 5.事件绑定 源码地址: https ...

  9. jQuery学习笔记之概念(1)

    jQuery学习笔记之概念(1) ----------------------学习目录-------------------- 1.概念 2.特点 3.选择器 4.DOM操作 5.事件 6.jQuer ...

随机推荐

  1. Greedy:Jessica's Reading Problem(POJ 3320)

    Jessica's Reading Problem 题目大意:Jessica期末考试临时抱佛脚想读一本书把知识点掌握,但是知识点很多,而且很多都是重复的,她想读最少的连续的页数把知识点全部掌握(知识点 ...

  2. 关于定时器 setTimeout

    1.这里不考虑线程问题.把javascript想象成在时间线上运行,页面载入时,首先执行的是<script>标签中的代码,之后,将执行更多代码,当进程空闲时,下个代码就被触发并执行 如图: ...

  3. HDU 5995 Kblack loves flag ---BestCoder Round #90

    题目链接 用两个布尔数组分别维护每个行/列是否被插过旗帜,最后枚举每一行.列统计答案即可.空间复杂度O(n+m),时间复杂度O(n+m+k). #include <cstdio> #inc ...

  4. jvm学习

    一.jps主要用来输出JVM中运行的进程状态信息 jps [options] [hostid] 如果不指定hostid就默认为当前主机或服务器. Jps -ml 二.jstack主要用来查看某个Jav ...

  5. python基础——单元测试

    python基础——单元测试 如果你听说过“测试驱动开发”(TDD:Test-Driven Development),单元测试就不陌生. 单元测试是用来对一个模块.一个函数或者一个类来进行正确性检验的 ...

  6. limits.h头文件

    CHAR,SHRT,INT ,LLONG加_MAX后缀表示最大,加_MIN后缀表示最小,加U前缀表示无符号 UCHAR_MIN ,UCHAR_MAX sizeof()计算数所用的空间 #include ...

  7. XMPP框架下微信项目总结(8)图片发送

    前言:“图片”发送和“聊天文本”都是通过模块发起的成为:“消息模块”(反正传递的都是字符串) 发送原理:     1 current客户端获取本地图片 2 xmpp发送“字符串”(为什么是字符串?1: ...

  8. 优化MyBatis配置文件中的配置

    一.为实体类定义别名,简化sql映射xml文件中的引用 之前,我们在sql映射xml文件中的引用实体类时,需要写上实体类的全类名(包名+类名),如下: <!-- 创建用户(Create) --& ...

  9. 关于JAVA的String类的一些方法

    一.得到字符串对象的有关信息 1.通过调用length()方法得到String的长度. String str=”This is a String”; int len =str.length(); 2. ...

  10. php页面判断是 iphone还是andriod的浏览器&通过 URL types在浏览器打开app(转)

    http://blog.csdn.net/totogo2010/article/details/8925483 解决一个二维码不同手机扫描下载时跳转的问题 判断后跳转对应的app下载 <?php ...