1. .parent() 方法： 用于获取匹配元素集合中每个元素的父元素。
$('span').parent(); // 获取每个 <span> 的直接父元素
2. .parents() 方法： 用于获取匹配元素集合中每个元素的所有祖先元素，可以选择性地提供一个选择器来筛选。
$('span').parents(); // 获取每个 <span> 的所有祖先元素
$('span').parents('.container'); // 获取每个 <span> 的所有祖先中类名为 .container 的元素
3. .closest() 方法： 用于获取匹配选择器的第一个祖先元素，可以选择性地提供一个选择器来筛选。
$('span').closest('.container'); // 获取每个 <span> 的最近的祖先中类名为 .container 的元素
这里是一个完整的例子：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>jQuery 祖先元素</title>
<script src="https://code.jquery.com/jquery-3.6.4.min.js"></script>
<style>
.container {
border: 2px solid black;
padding: 10px;
}
</style>
</head>
<body>
<div class="container">
<p>段落元素 <span>内部的 span 元素</span></p>
</div>
<script>
// 获取 <span> 的直接父元素
var parentElement = $('span').parent();
console.log(parentElement);
// 获取 <span> 的所有祖先元素
var allAncestors = $('span').parents();
console.log(allAncestors);
// 获取 <span> 的最近的祖先中类名为 .container 的元素
var closestContainer = $('span').closest('.container');
console.log(closestContainer);
</script>
</body>
</html>
在这个例子中，首先使用 .parent() 方法获取 <span> 的直接父元素，然后使用 .parents() 方法获取 <span> 的所有祖先元素，最后使用 .closest('.container') 方法获取 <span> 的最近的祖先中类名为 .container 的元素。
转载请注明出处：http://www.zyzy.cn/article/detail/12887/jQuery