JavaScript-jquery 使用属性选择器时遇到的问题
如下:
$("div [class='t']").length 与 $("div[class='t']").length
//或
$(".bg [name='test']").length 与 $(".bg[name='test']").length
//或
$("#id [type='input']").length 与 $("#id [type='input']").length
//等等类似上边的用法。
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
$("div [class='t']").length本质上等于
$("div *[class='t']").length
即div下所有class为t的元素,其他同理
$("div [class='t']")等于 $("div .t"),$("div[class='t']")等于 $("div>.t")。两个都是获取子集class为t的孩子,不过后者只会获取第一层,前者就会获取全部
说下我的理解,
这个应该是jQuery中CSS选择器的区别。
$("div [class='t']")这种方式叫做“ancestor descendant”,只选择div元素的后代元素中带有class为t的元素。
而$("div[class='t']")则只会选择带有class为t的div元素。
做了个例子,看下就一目了然了。
<!DOCTYPE html>
<html>
<head>
<meta name="description" content="[add your bin description]" />
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
<div class="t">
<span class="t">
</span>
<span class="t">
</span>
<div class="t">
</div>
<div class="t">
</div>
</div>
</body>
</html>
运行结果如下:
console.log($("div [class='t']").length);
console.log($("div[class='t']").length);
4
3
在线运行:
http://jsbin.com/ufimac/2/edit