Comment vérifier si un élément n'a PAS de classe spécifique?

232

Comment vérifier s'il n'y a pas de cours. Par exemple, je sais comment vérifier s'il a la classe "test", mais comment puis-je vérifier s'il n'a pas la classe "test"?

if($(this).hasClass("test")){
}
user1005793
la source

Réponses:

484
if (!$(this).hasClass("test")) {
sdleihssirhc
la source
34
Dans la veine TIMTOWTDI, voici une horrible solution: if($(this).is(":not(.test)"))> :)
Phrogz
6
TIMTOWTDIBSCINABTE
Fizzix
25
Au cas où quelqu'un se demanderait: il y a plus d'une façon de le faire, mais parfois la cohérence n'est pas une mauvaise chose non plus.
Captain Hypertext
145

La réponse de sdleihssirhc est bien sûr la bonne pour le cas dans la question, mais juste comme référence si vous devez sélectionner des éléments qui n'ont pas une certaine classe, vous pouvez utiliser le sélecteur not :

// select all divs that don't have class test
$( 'div' ).not( ".test" );
$( 'div:not(.test)' );  // <-- alternative 
JJJ
la source
8
À mon humble avis, votre réponse est la meilleure. Si la réponse de sdleihssirhc est correcte, cette question n'a rien à voir avec jQuery et serait mieux formulée comme «étant donnée une condition, comment puis-je tester que cette condition n'est PAS vraie en Javascript». Ce que nous voulons avec jQuery, c'est d'opérer sur des collections entières d'éléments DOM aussi facilement que possible sur des objets uniques. Votre réponse fournit exactement cette solution. +1
Stijn de Witt
1
@byronyasgur Dans le contexte de la question originale, l'affiche voulait tester si un certain élément connu n'avait pas la classe. Ce code sélectionne tous les éléments qui n'ont pas la classe, donc il ne résoudrait pas le problème de l'affiche. Je ne me souviens pas pourquoi j'ai posté cela en premier lieu.
JJJ
14

Sélectionnez un élément (ou groupe d'éléments) ayant la classe "abc", n'ayant pas la classe "xyz":

    $('.abc:not(".xyz")')

Lors de la sélection de CSS standard, vous pouvez utiliser .abc:not(.xyz).

George-Paul B.
la source
6

utilisez la méthode .not () et recherchez un attribut:

$('p').not('[class]');

Vérifiez-le ici: http://jsfiddle.net/AWb79/

Matthew Cira
la source
8
C'est complètement faux. Les crochets ne sont pas destinés aux classes mais utilisés pour les sélecteurs identifiant les attributs.
Misterparker
1
En fait, c'est tout à fait raison. La «[classe]» identifie correctement l'attribut de (pas) avoir une classe.
Deborah
Les classes @Misterparker sont des attributs.
Matthew Cira
cela vérifie si l'attribut est présent, pas le cas si un élément a une classe spécifique, comme dans la valeur de la classe
Mark
6

Vous pouvez essayer ceci:

<div id="div1" class="myClass">there is a class</div>
<div id="div2"> there is no class2 </div>

$(document).ready(function(){
    $("#div2").not('.myClass');  // do not have `myClass` class.
});
avion
la source
Cette réponse n'ajoute aucune valeur à la page, elle a été publiée il y a 7 ans. Veuillez ne jamais publier de contenu uniquement en code et en double.
mickmackusa
0

en lisant ces 6 ans plus tard et en pensant que je prendrais également un coup d' œil , également dans la veine TIMTOWTDI ...: D, en espérant que ce n'est pas une «étiquette JS» incorrecte.

J'ai l'habitude de mettre en place un var avec la condition, puis de m'en référer plus tard ..

// var set up globally OR locally depending on your requirements
var hC;

function(el) {
  var $this = el;
  hC = $this.hasClass("test");

  // use the variable in the conditional statement
  if (!hC) {
    //
  }
}

Bien que je devrais mentionner que je fais cela parce que j'utilise principalement l'opérateur ternaire conditionnel et que je veux du code propre. Donc dans ce cas, tout ce que j'aurais c'est ceci:

hC ? '' : foo(x, n) ;
   // OR -----------
!hC ? foo(x, n) : '' ;

...au lieu de cela:

$this.hasClass("test") ? '' : foo(x, n) ;
   // OR -----------
(!$this.hasClass("test")) ? foo(x, n) : '' ;
le_pragmatist
la source
0

Je ne sais pas pourquoi, mais la réponse acceptée n'a pas fonctionné pour moi. Au lieu de cela, cela a fonctionné:

if ($(this).hasClass("test") !== false) {}
Aljoša
la source
Cela vérifie en fait s'il a la classe "test". Afin de vérifier s'il N'A PAS la classe "test", vous devez avoir "=== false", ou "! == true" au lieu de "! == false".
Lisa Cerilli