$.closest()filter 必需。规定缩小搜索祖先元素范围的选择器表达式、元素或 jQuery 对象 conte

返回被选元素的第一个祖先元素： $(selector).closest(filter)

返回使用 DOM context 查找的 DOM 树中的第一个祖先元素： context: 上下文, 语境, 范围 $(selector).closest(filter,context)

filter 必需。规定缩小搜索祖先元素范围的选择器表达式、元素或 jQuery 对象 context 可选。在其内可以找到匹配元素的 DOM 元素

closest() 从当前元素开始沿 DOM 树向上遍历，并返回匹配所传递的表达式的第一个单一祖先返回包含零个或一个元素的 jQuery 对象沿 DOM 树向上遍历，直到找到已应用选择器的一个匹配为止参数不能为空

parents() 从父元素开始沿 DOM 树向上遍历，并返回匹配所传递的表达式的所有祖先返回包含零个、一个或多个元素的 jQuery 对象沿 DOM 树向上遍历，直到文档的根元素为止，将每个祖先元素添加到一个临时的集合；如果应用了选择器，则会基于该选择器对这个集合进行筛选参数可以为空

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

	<head>
		<meta http-equiv="Cache-Control" CONTENT="no-cache" />
		<meta http-equiv="Pragma" CONTENT="no-cache" />
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<title>$.closest() 的简单例子</title>
		<style type="text/css">
			li { margin: 3px; padding: 3px; background: #EEEEEE; }
			.hilight { background: yellow; }
		</style>
	</head>

	<body>

		<ul id="one" class="level-1">
			<li class="item-i">I</li>
			<li id="ii" class="item-ii">II
				<ul class="level-2">
					<li class="item-a">A</li>
					<li class="item-b">B
						<ul class="level-3">
							<li class="item-1">我们可以传递 DOM 元素作为 context，在其中搜索最接近的元素</li>
							<li class="item-2">context: 上下文, 语境, 范围</li>
							<li class="item-3">.closest('ul', context)</li>
						</ul>
					</li>
					<li class="item-c">C</li>
				</ul>
			</li>
			<li class="item-iii">III</li>
		</ul>

	</body>

	<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
	<script type="text/javascript" th:inline="javascript">
		$(document).bind("click", function(e) {
			$(e.target).closest("li").toggleClass("hilight");
		});

		var listItemII = document.getElementById('ii');
		$('li.item-a').closest('ul', listItemII).css('background-color', 'red');
		$('li.item-a').closest('#one', listItemII).css('background-color', 'green');
	</script>

</html>

end