Come verificare se un elemento NON ha una classe specifica?


232

Come posso verificare se non esiste una lezione? Ad esempio, so come verificare se ha la classe "test", ma come posso verificare se non ha la classe "test"?

if($(this).hasClass("test")){
}

Risposte:


484
if (!$(this).hasClass("test")) {

34
Nella vena di TIMTOWTDI, ecco una soluzione orribile: if($(this).is(":not(.test)"))> :)
Phrogz,

6
TIMTOWTDIBSCINABTE
Fizzix

25
Nel caso qualcuno si stia chiedendo: esiste più di un modo per farlo, ma a volte la coerenza non è una cosa negativa.
Capitano Hypertext

145

La risposta di sdleihssirhc è ovviamente quella corretta per il caso nella domanda, ma solo come riferimento se devi selezionare elementi che non hanno una certa classe, puoi usare il non selettore:

// select all divs that don't have class test
$( 'div' ).not( ".test" );
$( 'div:not(.test)' );  // <-- alternative 

8
IMHO la tua risposta è la migliore. Se la risposta di sdleihssirhc è corretta di questa domanda non ha nulla a che fare con jQuery e sarebbe meglio formulata come "data una condizione, come posso verificare che quella condizione NON sia vera in Javascript". Quello che vogliamo con jQuery è operare su intere raccolte di elementi DOM altrettanto semplici che possiamo su singoli oggetti. La tua risposta fornisce proprio quella soluzione. +1
Stijn de Witt,

1
@byronyasgur Nel contesto della domanda originale il poster voleva verificare se un certo elemento noto non aveva la classe. Questo codice seleziona tutti gli elementi che non hanno la classe, quindi non risolve il problema del poster. Non ricordo perché ho pubblicato questo in primo luogo.
JJJ

14

Seleziona elemento (o gruppo di elementi) con classe "abc", non con classe "xyz":

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

Quando si seleziona un normale CSS, è possibile utilizzare .abc:not(.xyz).


6

utilizzare il metodo .not () e verificare la presenza di un attributo:

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

Controllalo qui: http://jsfiddle.net/AWb79/


8
Questo è completamente sbagliato. Le parentesi non sono per le classi ma utilizzate per i selettori che identificano gli attributi.
Misterparker,

1
In realtà è completamente giusto. '[Class]' identifica correttamente l'attributo di (non) avere una classe.
Deborah,

Le classi @Misterparker sono attributi.
Matthew Cira,

questo controlla se l'attributo è presente, non nel caso in cui un elemento abbia una classe specifica, come nel valore della classe
Segna il

6

Puoi provare questo:

<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.
});

Questa risposta non aggiunge alcun valore alla pagina, è stata pubblicata 7 anni prima. Ti preghiamo di non pubblicare contenuti solo duplicati e di codice.
Mickmackusa,


0

leggendo questo 6 anni più tardi e ho pensato che avrei anche fatto un trucco, anche nella vena TIMTOWTDI ...: D, sperando che non sia errata "etichetta JS".

Di solito imposto un var con la condizione e poi mi riferisco ad esso più tardi..ie;

// 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) {
    //
  }
}

Anche se dovrei dire che lo faccio perché utilizzo principalmente l'operatore ternario condizionale e voglio un codice pulito. Quindi, in questo caso, tutto ciò che avrei è questo:

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

...Invece di questo:

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

0

Non so perché, ma la risposta accettata non ha funzionato per me. Invece ha funzionato:

if ($(this).hasClass("test") !== false) {}

Questo in realtà controlla se ha classe "test". Per verificare se NON ha classe "test", devi avere "=== false" o "! == true" invece di "! == false".
Lisa Cerilli,
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.