jquery父节点

jQuery 获取父节点的方法

使用 jQuery 可以轻松获取元素的父节点，以下是几种常用方法：

parent()
获取直接父元素，仅向上查找一层：

$('childSelector').parent();

parents()
获取所有祖先元素，可指定筛选条件：

$('childSelector').parents(); // 所有祖先
$('childSelector').parents('.filterClass'); // 特定条件的祖先

parentsUntil()
获取祖先元素直到指定的父级（不包含终止元素）：

$('childSelector').parentsUntil('.stopSelector');

closest()
从当前元素开始向上查找匹配的第一个祖先（包含自身）：

$('childSelector').closest('.targetClass');

示例代码

假设 HTML 结构如下：

<div class="grandparent">
  <div class="parent">
    <span class="child">目标元素</span>
  </div>
</div>

获取父节点示例：

// 获取直接父元素
$('.child').parent(); // 返回 <div class="parent">

// 获取所有祖先中的 div 元素
$('.child').parents('div'); // 返回 [<div.parent>, <div.grandparent>]

// 查找最近的父级 div
$('.child').closest('div'); // 返回 <div class="parent">

注意事项

• parent() 和 parents() 返回的是 jQuery 对象，可通过 .length 判断是否存在匹配元素。
• closest() 从自身开始匹配，若自身符合条件则返回自身。
• 这些方法均可链式调用，例如 $('.child').parent().addClass('highlight')。