返回被选元素的第一个祖先元素： $(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
常见问题FAQ
- 免费下载或者VIP会员专享资源能否直接商用？
- 本站所有资源版权均属于原作者所有，这里所提供资源均只能用于参考学习用，请勿直接商用。若由于商用引起版权纠纷，一切责任均由使用者承担。更多说明请参考 VIP介绍。
- 提示下载完但解压或打开不了？
- 找不到素材资源介绍文章里的示例图片？
- 模板不会安装或需要功能定制以及二次开发？
发表评论
还没有评论，快来抢沙发吧！