Rumah > Artikel > hujung hadapan web > 怎么使用jquery获取父元素？jquery获取父元素方法

怎么使用jquery获取父元素？jquery获取父元素方法

云罗郡主asal: 2018-11-03 15:04:586060semak imbas

其实使用jquery获取父级的方法还是比较多的，例如使用parent()，parents()，closest()，这些都是可以帮助你查找父元素，下面我们来讲一下怎么使用jquery获取父元素？jquery获取父元素方法。

一、parent()方法

在jQuery中，我们可以使用parent()方法来查找当前元素的“父元素”。记住，元素只有一个父元素。

语法：parent(expression)

说明：参数expression表示jQuery选择器表达式，用来过滤父元素。当参数省略时，则选择所有的父元素。如果参数不省略，则选择符合条件的父元素。

元素不是只有一个父元素么？为什么还有“符合条件的父元素”这一说法？对于这个，可以看看下面的例子。

举例:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript" src="../App_js/jquery-1.12.0.min.js"></script>
    <script type="text/javascript">
        $(function () {
            $("p").parent(".lvye").css("color", "red");
        })
    </script>
</head>
<body>
    <div><p>php中文网jQuery入门教程</p></div>
    <div class="lvye"><p>php中文网jQuery入门教程</p></div>
    <div><p>php中文网jQuery入门教程</p></div>
</body>
</html>

效果如下：

微信截图_20181103150107.png

二、parents()方法

parents()方法和parent()方法相似，都是用来查找所选元素的祖先元素。但是这两个方法也有着本质的区别。

其实这2个方法也很好区分，parent是单数形式，查找的祖先元素只有1个，那就是父元素。而parents是复数形式，查找的祖先元素当然是所有的祖先元素。

语法：parents(expression)

说明：参数expression表示jQuery选择器表达式字符串，用来过滤祖先元素。当参数省略时，则选择所有的祖先元素。如果参数不省略，则选择符合条件的祖先元素。

举例:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript" src="../App_js/jquery-1.12.0.min.js"></script>
    <script type="text/javascript">
        $(function () {
            $("#btn").click(function () {
                var parents = $("span").parents()
                              .map(function () { return this.tagName; })
                              .get().join(",");
                alert("span元素的所有祖先元素为：" + parents.toLowerCase());
            });
        })
    </script>
</head>
<body>
    <div><p><strong><span>jQuery入门教程</span></strong></p></div>
    <input id="btn" type="button" value="获取" />
</body>
</html>

效果如下：

微信截图_20181103150119.png

三、parentsUntil()方法

parentsUntil()方法是对parents()方法的一个补充，它可以查找指定范围的所有祖先元素，相当于在parents()方法返回集合中截取部分祖先元素。

语法：parents(expression)

参数selector表示jQuery选择器表达式字符串，用以确定范围的祖先元素。该参数为可选，如果省略，则将匹配所有祖先元素，这一点跟parents()方法查找结果是一样的。

由于parentsUntil()方法用得不多，为了减轻初学者的记忆负担，我们可以直接忽略。如果想要深入学习的话，可以参考：jQuery教程。

Atas ialah kandungan terperinci 怎么使用jquery获取父元素？jquery获取父元素方法. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan：

Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Artikel sebelumnya：js循环结构有哪些？js循环结构概述Artikel seterusnya：jquery如何查找后代元素？jquery获取后代元素方法

Artikel berkaitan

Lihat lagi