祖先是父、祖父或曾祖父等等。

通过 jQuery,您能够向上遍历 DOM 树,以查找元素的祖先。


向上遍历 DOM 树

这些 jQuery 方法很有用,它们用于向上遍历 DOM 树:


jQuery parent() 方法

parent() 方法返回被选元素的直接父元素。

该方法只会向上一级对 DOM 树进行遍历。

下面的例子返回每个 <span> 元素的的直接父元素:

实例

$(document).ready(function(){
  $("span").parent();
});

尝试一下 »

提示:在本站的jQuery编程实战中,你可以练习:jQuery使用parent()操作父级元素


jQuery parents() 方法

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

下面的例子返回所有 <span> 元素的所有祖先:

实例

$(document).ready(function(){
  $("span").parents();
});

尝试一下 »

您也可以使用可选参数来过滤对祖先元素的搜索。

下面的例子返回所有 <span> 元素的所有祖先,并且它是 <ul> 元素:

实例

$(document).ready(function(){
  $("span").parents("ul");
});

尝试一下 »


jQuery parentsUntil() 方法

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

下面的例子返回介于 <span> 与 <div> 元素之间的所有祖先元素:

实例

$(document).ready(function(){
  $("span").parentsUntil("div");
});

尝试一下 »

jQuery 遍历 – 祖先的更多相关文章

  1. jQuery 遍历祖先

    祖先是父.祖父或曾祖父等等. 通过 jQuery,您能够向上遍历 DOM 树,以查找元素的祖先. 向上遍历 DOM 树 这些 jQuery 方法很有用,它们用于向上遍历 DOM 树: parent() ...

  2. jQuery遍历-祖先

    祖先是父.祖父或曾祖父等等. 通过 jQuery,您能够向上遍历 DOM 树,以查找元素的祖先. 向上遍历 DOM 树 这些 jQuery 方法很有用,它们用于向上遍历 DOM 树: parent() ...

  3. jQuery遍历祖先元素:parentsUntil

    Description: Get the ancestors of each element in the current set of matched elements, up to but not ...

  4. jQuery 遍历 - 祖先

    通过 jQuery,您能够向上遍历 DOM 树,以查找元素的祖先. 向上遍历 DOM 树 这些 jQuery 方法很有用,它们用于向上遍历 DOM 树: parent() parents() pare ...

  5. JQuery:JQuery遍历详解

    JQuery:遍历一.什么是遍历?jQuery 遍历,意为"移动",用于根据其相对于其他元素的关系来"查找"(或选取)HTML 元素.以某项选择开始,并沿着这个 ...

  6. 常用的jquery遍历函数

    1.Jquery遍历祖先 1).parent()  方法返回被选元素的直接父元素. 2).parents()  方法返回被选元素的所有祖先元素,它一路向上直到文档的根元素 (<html>) ...

  7. jquery遍历DOM方法总结

    1.jQuery 遍历 - 祖先 向上遍历 DOM 树 这些 jQuery 方法很有用,它们用于向上遍历 DOM 树: parent() parents() parentsUntil() jQuery ...

  8. jQuery遍历文档(重要)

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

  9. jQuery 遍历函数

    转载http://www.cnblogs.com/tylerdonet/archive/2013/04/05/3000618.html jQuery 遍历函数包括了用于筛选.查找和串联元素的方法. 函 ...

随机推荐

  1. django知识回顾

    一.web框架 1.web框架本质 众所周知,对于所有的web应用,本质上其实就是一个socket服务端,用户的浏览器其实就是一个socket客户端 1.浏览器(socket客户端) 2.发送IP和端 ...

  2. 南京邮电大学java第一次实验报告

    实 验 报 告 ( 2017 / 2018学年 第2学期) 课程名称 JAVA语言程序设计 实验名称 Java集成开发环境的安装与使用. Java变量.表达式与控制结构 实验时间 2018 年 4 月 ...

  3. POJ-1122 FDNY to the Rescue!---Dijkstra+反向建图

    题目链接: https://vjudge.net/problem/POJ-1122 题目大意: 给出矩阵,矩阵中每个元素tij表示从第i个交叉路口到第j个交叉路口所需时间,若tij为-1则表示两交叉路 ...

  4. 【转】Python3中urllib详细使用方法(header,代理,超时,认证,异常处理)

      urllib是python的一个获取url(Uniform Resource Locators,统一资源定址器)了,我们可以利用它来抓取远程的数据进行保存哦,下面整理了一些关于urllib使用中的 ...

  5. 简述angular自定义过滤器在页面和控制器中的使用

    首先设置自定义过滤器. 定义模块名:angular ? 1 2 3 4 5 6 .module('myApp') .filter('filterName',function(){ return fun ...

  6. BZOJ 4551[Tjoi2016&Heoi2016]树(树链剖分+二分)

    Description 在2016年,佳媛姐姐刚刚学习了树,非常开心.现在他想解决这样一个问题:给定一颗有根树(根为1),有以下两种操作:1. 标记操作:对某个结点打上标记(在最开始,只有结点1有标记 ...

  7. Redis管理之持久化

    Redis的一大重要特征就是支持持久化. Redis提供了两种不同的持久化方式:RDB和AOF. RDB持久化可以在指定的时间间隔内生成数据集的快照.由于是定期的生成数据集的快照,所以,如果服务器出现 ...

  8. Redis数据类型--string

    在Redis中支持丰富的数据类型的存储系统,包括:字符串(string),散列(hashes),列表(lists),集合(sets),有序集合(sorted sets),与范围查询,bitmaps,h ...

  9. [HNOI2012]与非

    题目描述 NAND(与非)是一种二元逻辑运算,其运算结果为真当且仅当两个输入的布尔值不全为真.NAND运算的真值表如下(1表示真,0表示假): 两个非负整数的NAND是指将它们表示成二进制数,再在对应 ...

  10. 神在夏至祭降下了神谕(oracle)

    首先这道题样例很多,先一个一个看 我们发现k为奇数是必为winter,其实可以证明 k为奇数时,k=a+(a+1)意味着可以直接实现winter士兵+1,summer士兵-1 k为偶数时,显然当m也为 ...