jQuery 中的 parent() 和 parents() 方法有什么区别？

jQuery 是一种广泛使用的 JavaScript 库，其中包含了许多有用的 DOM 操作方法。在 jQuery 中，我们经常需要查找某个元素的父元素，这时候就可以使用 parent() 和 parents() 方法。虽然这两个方法的用途相似，但它们之间有一些区别。

parent() 方法

parent() 方法返回指定元素的直接父元素。如果我们给 parent() 方法传递一个选择器参数，则方法会筛选出和选择器匹配的父元素。

// 获取某个元素的直接父元素
$('.child-element').parent();

// 获取某个元素的直接父元素（筛选出 class 为 "parent-container" 的父元素）
$('.child-element').parent('.parent-container');

parents() 方法

parents() 方法返回指定元素的所有父元素，直到根元素（也就是 document 对象）。如果我们给 parents() 方法传递一个选择器参数，则方法会筛选出和选择器匹配的所有父元素。

// 获取某个元素的所有父元素
$('.child-element').parents();

// 获取某个元素的所有父元素（筛选出 class 为 "parent-container" 的父元素）
$('.child-element').parents('.parent-container');

区别

总结一下，parent() 方法只会返回指定元素的直接父元素，而 parents() 方法会返回指定元素的所有父元素，直到根元素。此外，parent() 方法只接受一个可选的选择器参数，而 parents() 方法可以接受多个选择器参数。因此，在实际使用中，我们需要根据具体的需求来选择使用哪个方法。

参考链接

• jQuery parent() 方法
• jQuery parents() 方法