<!--

parent是指取得一个包含着所有匹配元素的唯一父元素的元素集合。

parents则是取得一个包含着所有匹配元素的祖先元素的元素集合（不包含根元素）。可以通过一个可选的表达式进行筛选。

parent取得很明确就是当前元素的父元素

parents则是当前元素的祖先元素

-->

<html>

    <head></head>

    <body>

        <div id="div1">

        <div id="div2"><p></p></div>

        <div id="div3" class="a"><p></p></div>

        <div id="div4"><p></p></div>

        </div>

    </body>

    <script type="text/javascript" src="jquery-1.7.1.min.js"></script>

    <script type="text/javascript">

        $("p").parent();              //取得的是div2、div3、div4

        $('p').parent('.a');        //取得是div3

        $('p').parent().parent();    //取得是div1（这点比较奇特，不过Jquery对象本身的特点决定了这是可行的）

        $('p').parents();            //取得的是div1、div2、div3、div4

        $('p').parents('.a');        //取得的是div3

    </script>

</html>
    <body>

        <table>

            <tr>

                <td><input id="btn1" class="btn" type="button" value="test"/></td>

                <td>some text</td>

            </tr>

        </table>

    </body>

    <script type="text/javascript" src="jquery-1.7.1.min.js"></script>

    <script type="text/javascript">

    $(function(){

        $("#btn1").click(function(){

            alert($(this).parent().next().html());

            });

        });

打印结果：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。

另一个例子中：

<div>

     <p>Hello</p>

     <p>Hello</p>

</div>

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

有关parents

 <div id="one">

        <div id="Two">hello</div>

        <div id="Three">

            <p><a href="#">tonsh</a></p>

        </div>

</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(找到某一特定的祖先元素)用法（转发：https://blog.csdn.net/cui_angel/article/details/7903704）的更多相关文章

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

    <!-- 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 实现密码框的显示与隐藏【转载自http://blog.csdn.net/fengzhishangsky/article/details/11809069】

    <html> <head>  <script type="text/JavaScript"  src="jQuery-1.5.1.min.j ...

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

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

  6. Jquery中parent()和parents()

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

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

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

  8. jQuery的parent和parents和closest区别

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

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

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

随机推荐

  1. node - post - 上传图片

    html代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="U ...

  2. defer,panic,recover

    Go语言不支持传统的 try…catch…finally 这种异常,因为Go语言的设计者们认为,将异常与控制结构混在一起会很容易使得代码变得混乱.因为开发者很容易滥用异常,甚至一个小小的错误都抛出一个 ...

  3. Laravel之Session

    一.配置 Session 配置文件位于config/session.php .默认情况下,Laravel 使用的session 驱动为文件驱动,这对许多应用而言是没有什么问题的.在生产环境中,你可能考 ...

  4. 迭代器适配器（一）back_inserter和front_inserter的实现

    本文讨论back_inserter和front_inserter的实现. 当我们调用copy函数的时候,要确保目标容器具有足够大的空间,例如: //将other的所有元素拷贝到以coll.begin( ...

  5. Jeewx 捷微管家操作配置文档（开源版本号）

    1.1.1.  公众帐号管理 (1)捷微是第三方微信公众帐号管理平台,使用本平台前,请自行注冊申请微信公众帐号,操作流程请參照百度经验[怎样注冊微信公众帐号]: http://jingyan.baid ...

  6. 【BIEE】分析的解析机制

    今天使用BIEE时意外的发现个问题,BIEE在展示结果时候,是先进行排序,然后再展示.具体测试案例如下: 首先,存在如下数据: 在BIEE展示效果如下: 目前是根据O1,02,03,04,05,06, ...

  7. 安装npm install时，长时间停留在某一处的解决方案

    默认情况npm install安装时,会从 github.com 上下载文件,大部分安装不成功的原因都源自这里 因为 GitHub Releases 里的文件都托管在 s3.amazonaws.com ...

  8. 摘录 LDAP

    1.LDAP就是 light DAP, 轻量级目录访问协议     LDAP是轻量目录访问协议(Lightweight Directory Access Protocol)的缩写     LDAP标准 ...

  9. 数据库表设计时一对一关系存在的必要性 数据库一对一、一对多、多对多设计 面试逻辑题3.31 sql server 查询某个表被哪些存储过程调用 DataTable根据字段去重 .Net Core Cors中间件解析 分析MySQL中哪些情况下数据库索引会失效

    数据库表设计时一对一关系存在的必要性 2017年07月24日 10:01:07 阅读数:694 在表设计过程中,我无意中觉得一对一关系觉得好没道理,直接放到一张表中不就可以了吗?真是说,网上信息什么都 ...

  10. Android 使用SwipeBackLayout实现滑动返回上一级页面——实战来袭

    我们知道.APP在设计上习惯性的把返回button放在屏幕的左上角,那么,在非常多时候(尤其是大屏幕手机),操作改返回button,就会有诸多不便了.为了更加方便实现"返回"功能. ...