选择没有任何类的元素

时间:2011-02-14 11:22:53

标签: jquery html jquery-selectors

我需要通过jQuery选择器找到页面中没有类的所有跨度。

示例:

<span class='Cool'>do not found me</span>
<span>me, me, take me please!!!</span>

2 个答案:

答案 0 :(得分:61)

使用:not()attribute not selector [att!=val]过滤掉具有非空class属性的元素:

$('span:not([class!=""])')

jsFiddle preview

但请注意[att!=val]是非标准的jQuery选择器,这意味着选择器不能在CSS中使用或与document.querySelectorAll()一起使用。如果你像我一样,并且你是遵循标准的坚持者,所以想尽可能避免使用非标准的jQuery选择器,以下是直接的等价物:

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

匹配

  • span 没有 class属性的元素,
  • span元素具有class属性,但仅在属性值为空时才会生效。

但在大多数情况下,您应该只能使用第一部分:

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

您通常只会在负责输出的应用程序生成的标记中找到空class属性,或者由未注意的开发人员找到。{/ p>

答案 1 :(得分:4)

请参阅此答案,仅使用css Can I write a CSS selector selecting elements NOT having a certain class?

执行此操作
:not([class])

实际上,这将选择任何没有应用.class的东西。

我收集了jsfiddle演示

HTML

<h2 class="fake-class">fake-class will be green</h2>
<h2 class="">empty class SHOULD be white</h2>
<h2>no class should be red</h2>
<h2 class="fake-clas2s">fake-class2 SHOULD be white</h2>
<h2 class="">empty class2 SHOULD be white</h2>
<h2>no class2 SHOULD be red</h2>

CSS

h2 {color:#fff}
:not([class]) {color:red;background-color:blue}
.fake-class {color:green}