1. <!--
  2. parent是指取得一个包含着所有匹配元素的唯一父元素的元素集合。
  3. parents则是取得一个包含着所有匹配元素的祖先元素的元素集合（不包含根元素）。可以通过一个可选的表达式进行筛选。
  4. parent取得很明确就是当前元素的父元素
  5. parents则是当前元素的祖先元素
  6. -->
  7. <html>
  8. <head></head>
  9. <body>
  10. <div id="div1">
  11. <div id="div2"><p></p></div>
  12. <div id="div3" class="a"><p></p></div>
  13. <div id="div4"><p></p></div>
  14. </div>
  15. </body>
  16. <script type="text/javascript" src="jquery-1.7.1.min.js"></script>
  17. <script type="text/javascript">
  18. $("p").parent();            //取得的是div2、div3、div4
  19. $('p').parent('.a');        //取得是div3
  20. $('p').parent().parent();   //取得是div1（这点比较奇特，不过Jquery对象本身的特点决定了这是可行的）
  21. $('p').parents();           //取得的是div1、div2、div3、div4
  22. $('p').parents('.a');       //取得的是div3
  23. </script>
  24. </html>
  1. <body>
  2. <table>
  3. <tr>
  4. <td><input id="btn1" class="btn" type="button" value="test"/></td>
  5. <td>some text</td>
  6. </tr>
  7. </table>
  8. </body>
  9. <script type="text/javascript" src="jquery-1.7.1.min.js"></script>
  10. <script type="text/javascript">
  11. $(function(){
  12. $("#btn1").click(function(){
  13. alert($(this).parent().next().html());
  14. });
  15. });

打印结果：some text

其中：

1、this.parent() 获取的是input前面的td；

2、this.parent().parent() 获取的是tr；

3、this.parent().parent().parent() 获取的是table；

4、this.parent().next() 获取的是input前面的td相邻的另一个td。

另一个例子中：

  1. <div>
  2. <p>Hello</p>
  3. <p>Hello</p>
  4. </div>

$('p').parent() 得到的是：<div><p>Hello</p><p>Hello</p></div>对象，因为p标签的父标签是div

有关parents

  1. <div id="one">
  2. <div id="Two">hello</div>
  3. <div id="Three">
  4. <p><a href="#">tonsh</a></p>
  5. </div>
  6. </div>

$("a").parent() 将会得到父对象<p>

$("a").parents()  得到父对象<p><div.3><div.1>

$("a").parents().filter("div") 将得到<div.3><div.1> 还可以写成$("a").parents("div")。

如果想得到<div.2>对象可以写成这样：$("a").parents("div:eq(0)")。

如果点击<a>链接时弹出<div.2>中的内容该怎么办？

var id=$("a").parents("div:eq(1)").children("div:eq(0)").html();

alert(id);

Jquery的parent和parents(找到某一特定的祖先元素)用法的更多相关文章

  1. Jquery的parent和parents(找到某一特定的祖先元素)用法（转发：https://blog.csdn.net/cui_angel/article/details/7903704）

    <!-- parent是指取得一个包含着所有匹配元素的唯一父元素的元素集合. parents则是取得一个包含着所有匹配元素的祖先元素的元素集合(不包含根元素).可以通过一个可选的表达式进行筛选. ...

  2. 转：Jquery的parent和parents(找到某一特定的祖先元素)

    Jquery的parent和parents(找到某一特定的祖先元素) 关于Jquery的parent和parents parent是指取得一个包含着所有匹配元素的唯一父元素的元素集合.parents则 ...

  3. Jquery的parent和parents(找到某一特定的祖先元素)

    关于Jquery的parent和parents parent是指取得一个包含着所有匹配元素的唯一父元素的元素集合.parents则是取得一个包含着所有匹配元素的祖先元素的元素集合(不包含根元素).可以 ...

  4. Jquery中parent()和parents()

    一.parent()方法 此方法取得匹配元素集合中每个元素的紧邻父元素,也就是第一级父元素,而不是所有的祖先元素.所取得的父元素集合也可以使用表达式进行筛选. 二.parents()方法 此方法取得一 ...

  5. 前端开发入门到进阶附录一【JQuery中parent()，parents()，parentsUntil()区别和使用技巧】

    JQuery中parent(),parents(),parentsUntil()区别和使用技巧:https://blog.csdn.net/china1223/article/details/5193 ...

  6. jQuery中.parent和.parents的区别

    .parent(selector) 获得当前匹配元素集合中每个元素的父元素,由选择器筛选(可选). .parents(selector) 获得当前匹配元素集合中每个元素的祖先元素,由选择器筛选(可选) ...

  7. jQuery的parent和parents和closest区别

    1.parent是指取得一个包含着所有匹配元素的唯一父元素的元素集合.2.parents则是取得一个包含着所有匹配元素的祖先元素的元素集合(不包含根元素).可以通过一个可选的表达式进行筛选.3.clo ...

  8. jQuery通过parent()和parents()方法访问父级元素

    <div class="inputGroup"> <p>2.您的最高学历是?</p> <label><input type=& ...

  9. JS和jQuery获取节点的兄弟，父级，子级元素

    原文转自http://blog.csdn.net/duanshuyong/article/details/7562423 先说一下JS的获取方法,其要比JQUERY的方法麻烦很多,后面以JQUERY的 ...

随机推荐

  1. CDH- 集群时间同步ntp问题解决

    在CDH集群中发现有两台机器获取不到心跳(),导致监控不了机器状态,出现告警 可以使用ntpstat检查与ntp 服务器的时间偏差状态 使用 ntpstat 发现没有同步到ntp时间服务器,运行 nt ...

  2. spring学习（4）

    在spring容器内拼凑bean叫做装配.装配bean的时候,需要告诉容器哪些bean以及容器如何使用依赖注入将它们配合在一起. 上下文定义文件的根元素是<beans>,<beans ...

  3. Thinkphp跨模块调用视图文件

    当需要跨模块调用视图文件时,需要使用被包含文件的完整路径,如: <include file="./App/Home/View/Store/header.html"/> ...

  4. Queue 输出数据

    坑人的引用类型....输出看看结果是什么 Queue<ParaInfo> strStranList = new Queue<ParaInfo>(); StringBuilder ...

  5. window操作常识

  6. ajax（异步页面动态刷新）

    AJAX即“Asynchronous Javascript And XML”(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术. AJAX = 异步 JavaScript和 ...

  7. Python基础-redis模块使用

    redis是一个数据库,他的数据全都是存放在内存里面的,redis每秒能支持30w次的读写,存放有两种格式,一种string类型,一种是hash类型 一,操作string类型 r=redis.Redi ...

  8. Linux-iptables(2)

    iptables防火墙可以用于创建过滤(filter)与NAT规则.所有Linux发行版都能使用iptables,因此理解如何配置iptables将会帮助你更有效地管理Linux防火墙.如果你是第一次 ...

  9. SQL关联查询中on与where

    微信公众号:刺刺刺猬的优雅 前段时间,做一个查询,打算用left join查询存在于A表但不存在于B表记录,但怎么查都不对,原因是把所有filter全部放在了where语句中,因此回头看了资料,记录一 ...

  10. 在YUV图像上根据背景色实现OSD反色

    所谓的OSD其实就是在视频图像上叠加一些字符信息,比如时间,地点,通道号等, 在图像上叠加OSD通常有两种方式: 一种是在前端嵌入式设备上,在图像数据上叠加OSD, 这样客户端这边只需解码显示数据即可 ...