Question

获取具有类属性

的所有div

$('div[class]')

获取所有没有类属性的div

$('div[class!=""]')

此代码有效，但我不明白它为何有效。如果上面的代码有效，则具有class属性的所有div的代码应为

$('div[class=""]')

不会产生任何结果。

Answer 1

使用:not() pseudo-class selector：

进行尝试

$('div:not([class])')

修改

jQuery selectors的说明：

的 [attribute]
匹配具有指定属性的元素。

的 [attribute=value]
匹配具有指定属性且具有特定值的元素。

的 [attribute!=value]
匹配没有指定属性或具有指定属性但没有特定值的元素。

这意味着div[class=""]将选择所有使用空值指定class属性的DIV元素。

但是最后一个选择器是jQuery的专有选择器而不是CSS selector。您需要使用:not()来选择没有类的所有DIV元素：

div:not([class])

Answer 2

重要的是要知道有空类属性以及没有类属性的元素，但它们需要不同的测试来选择。

有许多测试都做不同的事情。这是我们测试的HTML：

<div class="">Empty Class Attribute </div>
<div class="column">Full Class Attribute </div>
<div>No Class Attribute </div>

现在，让我们运行我们的测试（第一部分只是一个字符串，可以帮助我们了解警报中刚刚调用的内容，否则无意义）：

$(document).ready(function(e){
  // Outputs "Empty Class Attribute Full Class Attribute"
  alert( "div[class] : "     + $('div[class]').text()     );

  // Outputs "Full Class Attribute"
  alert( "div[class!=''] : " + $('div[class!=""]').text() );

  // Outputs "Empty Class Attribute" 
  alert( "div[class=''] : "  + $('div[class=""]').text()  );

  // Outputs "No class Attribute"
  alert( "div:not([class]) : " + $('div:not([class])').text()     );
});

您可以在浏览器中查看此代码：http://jsbin.com/ijupu

现在，掌握了这些知识，如果您想要选择页面上的每个div元素，并使用空白属性和无属性，请使用以下选择器：

$("div[class=''], div:not([class])");

Answer 3

$('div[class=""]')选择器基本上读取：“获取其class属性具有空字符串作为其值的所有div元素。” - 排除了类中具有任何值的所有div元素除了空字符串之外的属性，以及根本没有设置类属性的所有div元素。

Answer 4

试

jQuery('div[class^=""]')

或

$('div[class^=""]')

这意味着获取所有具有任何名称

的类的div

jQuery获取所有没有class属性的div

4 个答案: