遍历方式:向上(父级元素)  向下(子元素)    水平(同胞元素)

一、向上遍历

  • parent()        向上一级   放回被选元素的直接父元素
  • parents()          返回被选元素的所有祖先元素    一路向上遍历(父级以及父级的父级等)
  • parentsUntil()    返回被选元素与括号内给定元素之间的所有祖先元素
$(document).ready(function(){
$("span").parentsUntil("div");
});

  

二、向下遍历

  • children()            返回被选元素的所有直接子元素
  • find()                  返回被选元素的后代元素  一路向下直到最后一个
$(document).ready(function(){
$("div").find("span");
});

  

$(document).ready(function(){
$("div").find("*");
});

  

三、水平遍历

1、siblings()       返回被选元素的所有同胞元素

2、next()    返回被选元素的下一份同胞元素

3、nextAll()    返回同胞元素的所有跟随的同胞元素

4、nextUntil()    返回介于两个给定参数(之后)之间的所有的同胞元素

5、prev()      返回被选元素的上一个同胞元素

6、prevAll()     返回被选元素之前的所有同胞元素     

7、prevUntil()      返回同胞元素与给定的元素(之前)之间的所有同胞元素

四、过滤

1、first() 方法      返回被选元素的首个元素

eg:

$(document).ready(function(){
$("div p").first(); //div的首个p元素
});

2、last()方法     返回被选元素的最后一个元素

eg:同上;

3、eq()方法  返回被选元素带有指定索引的元素

$(document).ready(function(){
$("p").eq(1); // 表示选取第二个p元素(索引从零开始)
});

  

4、filter() 方法    返回满足限制条件的元素

eg:

$(document).ready(function(){
$("p").filter(".intro"); //返回类名为intro的所有p元素
});

  

5、not()方法      返回排除了不匹配标准的所有元素

$(document).ready(function(){
$("p").not(".intro"); //返回除了类名有intro之外的,所有p元素
});

  

jquery学习笔记3 jq遍历的更多相关文章

  1. jquery学习笔记3——jq HTML

    jQuery最常用的部分就是操作DOM,jQuery提供了一系列操作DOM的相关方法,使其很容易: 一.获取 1.获取内容 text()方法    设置或返回所选元素的文本内容: html()方法   ...

  2. jquery学习笔记2——jq效果

    一.显示隐藏: 可以使用show()和hide()方法来显示隐藏: $("#hide").click(function(){ $("p").hide(); }) ...

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

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

  4. jQuery 学习笔记

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

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

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

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

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

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

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

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

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

  9. 初步学习jquery学习笔记(六)

    jquery学习笔记六 AJAX 简介 AJAX 是与服务器交换数据的技术,它在不重载全部页面的情况下,实现了对部分网页的更新. load() 方法 load() 方法从服务器加载数据,并把返回的数据 ...

随机推荐

  1. C/C++ 内存对齐

    一.什么是对齐,以及为什么要对齐: 1. 现代计算机中内存空间都是按照byte划分的,从理论上讲似乎对任何类型的变量的访问可以从任何地址开始,但实际情况是在访问特定变量的时候经常在特定的内存地址访问, ...

  2. Server Tomcat v6.0 at localhost was unable to start within 45 seconds

    在eclipse里启动tomcat的时候出现以下的错误: Server Tomcat v6.0 at localhost was unable to start within 45 seconds. ...

  3. dapper 可空bool转换出错及解决方案

    最近使用entityframewok生成数据库,使用dapper来访问数据库,产生了一个意外的bug,下面是产生bug的示例以及解决方案. 由于用entityframework生成数据库,默认情况en ...

  4. grunt--自动化任务快速上手

    这篇文章将带领你用Grunt来提速和优化网站开发的流程.首先我们会简短介绍Grunt的功能,然后我们直接上手,介绍如何用Grunt的不同插件来替你完成网站项目开发中的很多繁冗工作. 接着我们会创建一个 ...

  5. Python2 基于urllib2 的HTTP请求类

    一个利用urllib2模块编写的下载器,虽然有了requests模块,但是毕竟标准库 import urllib2,random class strong_down(): def __init__(s ...

  6. Python批量重命名

    某无聊的下午的一个小需求 import os dirPath = r'' #路径 format = r'' #后缀 name = 0 for file in os.listdir(dirPath): ...

  7. picturefill + picture 标签 实现兼容性很棒的 响应式图片 自适应 屏幕大小

    polyfill 它是一个能够补齐浏览器兼容性问题的一个东西,使用到的<picture></picture>标签 ,并不是所有浏览器都支持,为了实现更好的兼容效果,这里就使用到 ...

  8. 第9章 创建Web数据库

    1.登录MySQL: mysql -h hostname -u username -p password *-h 用于指定所希望连接的主机,即运行MySQL服务器的机器: -u 用于指定连接数据库时使 ...

  9. SpringMVC @ResponseStatus 的用法

    @ResponseStatus 用于修饰一个类或者一个方法,修饰一个类的时候,一般修饰的是一个异常类,如下, 声明一个异常类在类上面加上ResponseStatus注解,就表明,在系统运行期间,抛出A ...

  10. 关于Two-Pass标记连通域个数

    关于Two-Pass标记连通域个数 背景 在完成图像的一系列处理后,得到二值图,一般会统计目标数量,即是获取连通域个数,这里采用TwoPass的方法. 基本思想 在Two-pass连通域标记中,第一次 ...