Sélectionner les éléments sans classe

Question

J'ai besoin de trouver, via des sélecteurs jQuery, tous les espaces d'une page qui n'ont pas de classe.

Exemple :

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

Answer 1

Utilisez :not() et le attribut non sélecteur [att!=val] pour filtrer les éléments dont le nom n'est pas vide class attribut :

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

Aperçu de jsFiddle

Notez toutefois que [att!=val] est un sélecteur jQuery non standard, ce qui signifie que le sélecteur ne peut pas être utilisé dans les CSS ou avec le logiciel document.querySelectorAll() . Si vous êtes comme moi, et que vous êtes un inconditionnel du respect des normes, et que vous souhaitez éviter les sélecteurs jQuery non standard dans la mesure du possible, ce qui suit est un équivalent direct :

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

Cela correspond

• span éléments qui ont pas de class et
• span des éléments qui faire ont un class mais uniquement lorsque la valeur de l'attribut est vide.

Dans la plupart des cas, cependant, vous devriez pouvoir vous contenter de la première partie :

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

Vous ne trouverez généralement que des class dans le balisage généré par l'application chargée de le produire, ou par des développeurs qui ne font pas attention.

Answer 2

Voir cette réponse pour le faire avec css seulement Puis-je écrire un sélecteur CSS qui sélectionne les éléments qui n'ont PAS de classe ?

:not([class])

En fait, cela sélectionnera tout ce qui n'a pas de .class appliqué.

J'ai rassemblé un jsfiddle Démo

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}