jQuery parent() 方法

jQuery 中的 parent() 方法用于查找给定选择器的直接父元素。它是 jQuery 的内置函数。此方法只在 DOM 树中向上遍历一级，并返回所选元素的直接父元素。

parent() 方法与 parents() 方法类似，因为它们都向上遍历 DOM 树并返回父元素。但区别在于 parents() 方法在 DOM 树中向上遍历多级，并返回给定选择器的所有祖先元素，包括祖父元素、曾祖父元素等，而 parent() 方法只向上遍历一级，只返回给定选择器的直接父元素。

语法

上述语法中的 selector 表示要查找其父元素的选定元素。上述语法中的 filter 是可选参数，用于指定选择器表达式，以缩小搜索范围。

示例 1

在此示例中，我们没有使用 parent() 方法的可选参数。这里有一个 div 元素，它包含一个 ul 元素、一个标题 h2 和一个段落元素。

我们正在对标题 h2 应用 parent() 方法来查找其父元素。如果使用 parents() 方法而不是 parent() 方法，则标题 h2 的所有祖先元素，包括 body 元素，都将被高亮显示。

输出

执行上述代码后，输出将是 -

单击给定按钮后，输出将是 -

示例 2

在此示例中，我们使用 parent() 方法的可选参数来查找第一个 段落 元素的父元素。这里有多个段落元素，但我们必须找到第一个段落元素的父元素。因此，我们传递伪选择器 (:first) 作为 parent() 方法的可选值。

执行上述代码后，输出将是 -

单击给定按钮后，输出将是 -

Example3

在此示例中，我们使用 parent() 方法的可选参数来查找给定选择器的特定父元素。这里有三个具有不同父元素的段落元素。我们正在查找段落元素的 h2 父元素。因此，为了实现此目的，我们必须将 h2 作为 parent() 方法的可选值传递。

输出

执行上述代码后，输出将是 -

单击给定按钮后，输出将是 -