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

通过 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. 小技巧-ASP.Net session保存在数据库服务器

    引用博客:http://www.cnblogs.com/lykbk/archive/2013/01/13/hf576856868.html web Form 网页是基于HTTP的,它们没有状态, 这意 ...

  2. requests+正则表达式爬取ip

    #requests+正则表达式爬取ip #findall方法,如果表达式中包含有子组,则会把子组单独返回出来,如果有多个子组,则会组合成元祖 import requests import re def ...

  3. 解决:My97DatePicker 日期插件引用在PHP文件中maxDate和minDate控制失效问题

    开发环境: 语言:PHP 框架:ThinkPHP 问题:在引用插件My97DatePicker时,想实现:开始日期不能大于结束日期,结束时间不能小于开始时间 步骤一.查看文档官方文档http://ww ...

  4. HTTP首部扫盲

    [TOC] 之前在做web开发时使用到HTTP首部的时候遇到不熟悉的都是现用现查,时间一长印象就不深刻了.最近在重读<图解HTTP>,其中有一章是专门讲解HTTP首部的,讲解的HTTP首部 ...

  5. C++ namespace的作用

    namespace:命名空间或者叫名字空间,传统的c++只有一个全局的namespace,但是由于现在的程序规模越来越大,程序的分工越来越细,全局作用域就变得越来越拥挤,每个人都可能使用相同的名字来实 ...

  6. 报错django.db.migrations.exceptions.InconsistentMigrationHistory

    Pycharm强大的功能总是让我很是着迷,比如它的makemigrations 和 migrate. 然而某一次,当我再次敲下这熟悉的命令时,它报错了.... Traceback (most rece ...

  7. flex布局小记

    越来越深刻的感到日事日毕的必要性,很久之前就做了备忘说要深刻学习flex布局,没想到一拖就拖到了这个时候! 一,什么是flex布局: flex布局即flexible box布局,也就是弹性盒模型或者弹 ...

  8. vim 批量注释和批量取消注释

    批量注释 按ctrl+v进入可视块模式, 上下移动选中需要注释的行, 按I, 输入注释符号#, 按两下Esc, 保存   批量取消注释 按ctrl+v进入可视块模式, 上下移动选中需要取消注释的行, ...

  9. 【实验吧】CTF_Web_天下武功唯快不破

    打开链接"http://ctf5.shiyanbar.com/web/10/10.php",从页面内容未发现明显信息,查看源代码发现"please post what y ...

  10. Shiro加密

    在开发的时候,很多数据我们都希望是以加密过后的形式存储起来,而不是最原始的数据. 在shiro中也提供了编码,解码,加密,加密算法实现等等一系列的内容. 编码/解码 在org.apache.shiro ...