关于jQuery选择器的空格问题

最新推荐文章于 2021-06-09 21:28:12 发布

Jeffrey__Lin

最新推荐文章于 2021-06-09 21:28:12 发布

阅读量745

点赞数 1

本文链接：https://blog.csdn.net/L1nJIayu/article/details/54316199

版权

刚开始学jQuery，正在学表单选择器的时候遇到了问题，但死活找不出问题来，接着就对照着数一点一点看，终于发现，原来是少了一个空格！

我就很疑惑多一个空格跟少了一个空格怎么区别那么大？上网查了一下，现在懂了。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>jQuery选择器的空格问题</title>
		<script type="text/javascript" src="../js/jquery.js"></script>
		<script type="text/javascript" src="../js/jquery.min.js"></script>
		<script type="text/javascript">
		$(function(){
			$("#showLength1").html("带空格的长度:" + $(".d1 :hidden").length);
			$("#showLength2").html("不带空格的长度:" + $(".d1:hidden").length);
		})
		</script>
	</head>
	<body>
		<div class="d1">
			<div style="display: none;"></div>
			<div style="display: none;"></div>
			<div style="display: none;"></div>
		</div>
		<div class="d1" style="display: none;">
			<div style="display: none;"></div>
			<div style="display: none;"></div>
			<div style="display: none;"></div>
		</div>
		<div class="d1" style="display: none;">
			<div style="display: none;"></div>
			<div style="display: none;"></div>
			<div style="display: none;"></div>
		</div>
		<div id="showLength1"></div>
		<div id="showLength2"></div>
	</body>
</html>

上面的输出，带空格的为9，不带空格的为2.

对于加了空格来说，所获取的是class="d1"的元素的子元素中的隐藏元素。

对于没加空格的来说，所获取的是class="d1"的元素中的隐藏元素。

class="d1"的元素的子元素中的隐藏元素有9个；

class="d1"的元素中的隐藏元素有2个。

所以才会出现这些结果！

Jeffrey__Lin

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
关于jQuery选择器的空格问题

刚开始学jQuery，正在学表单选择器的时候遇到了问题，但死活找不出问题来，接着就对照着数一点一点看，终于发现，原来是少了一个空格！我就很疑惑多一个空格跟少了一个空格怎么区别那么大？上网查了一下，现在懂了。 jQuery选择器的空格问题 $(function(){ $("#showLength1").html("带空格的长度:"
复制链接

扫一扫