选择没有任何类的元素[重复]

Posted 2023-03-05

【中文标题】选择没有任何类的元素[重复]

【英文标题】：Select elements without any class [duplicate]

【发布时间】：2011-06-26 20:50:45

【问题描述】：

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

例子：

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

【参考方案1】：

使用: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 元素具有 no class 属性，并且 确实具有class属性的span元素，但仅当属性值为空时。

不过，在大多数情况下，您应该可以只使用第一部分：

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

您通常只会在负责输出它的应用程序或不注意的开发人员生成的标记中找到空的class 属性。

【讨论】：

你好！不适合我！但相反，这项工作非常好：span:not([class]) 谢谢你的建议！！！我成功了；）

@PadovaBoy：我的代码怎么会不适合你？ [!=""] 从 jQuery 的第一个版本就已经存在。

我不知道......它根本不起作用......我在window7下使用Firebug和FF 3.6.13版本的FireFinder来测试选择器

@PadovaBoy：无论如何，如果:not([class]) 有效，那很好:)

@brass-kazoo：第一个选择器的 CSS 版本有点不同，因为没有 [!=] 属性选择器；你会改用span:not([class]), span[class=""]。不过，在大多数情况下，您应该能够摆脱span:not([class])。您通常只会在脚本或不注意的人生成的标记中找到空的class 属性:)

【参考方案2】：

请参阅此答案以仅使用 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

【讨论】：

OP 要求提供 jquery 选择器

@berbt .. 谁需要将 .css-selector 转换为 $('.css-selector') ？

您的解决方案是可以接受的并在所选答案中使用，但是是的 - 由于作者要求提供 jQuery 上下文，因此最好在此上下文中提供答案，同时解释为什么它也是有效的在 CSS 中