Como verificar se um elemento NÃO possui uma classe específica?

232

Como verifico se não há uma aula. Por exemplo, eu sei como verificar se ela tem a classe "test", mas como faço para verificar se ela não tem a classe "test"?

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

Respostas:

484
if (!$(this).hasClass("test")) {
sdleihssirhc
fonte
34
Na veia TIMTOWTDI, aqui está uma solução horrível: if($(this).is(":not(.test)"))> :)
Phrogz
6
TIMTOWTDIBSCINABTE
Fizzix
25
Caso alguém esteja se perguntando: existe mais de uma maneira de fazer isso, mas às vezes a consistência também não é uma coisa ruim.
Captain Hypertext
145

A resposta de sdleihssirhc é, obviamente, a correta para o caso da pergunta, mas apenas como referência, se você precisar selecionar elementos que não têm uma determinada classe, poderá usar o seletor not :

// select all divs that don't have class test
$( 'div' ).not( ".test" );
$( 'div:not(.test)' );  // <-- alternative 
JJJ
fonte
8
IMHO sua resposta é a melhor. Se a resposta de sdleihssirhc estiver correta, essa questão não tem nada a ver com jQuery e seria melhor formulada como 'dada uma condição, como testo se essa condição NÃO é verdadeira em Javascript'. O que queremos com o jQuery é operar em coleções inteiras de elementos DOM da maneira mais fácil possível em objetos únicos. Sua resposta fornece exatamente essa solução. +1
Stijn de Witt
1
@byronyasgur No contexto da pergunta original, o pôster queria testar se um determinado elemento conhecido não tinha a classe. Esse código seleciona todos os elementos que não possuem a classe, portanto, não resolveria o problema do pôster. Não me lembro por que postei isso em primeiro lugar.
JJJ
14

Selecione o elemento (ou grupo de elementos) com a classe "abc", sem a classe "xyz":

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

Ao selecionar CSS regular, você pode usar .abc:not(.xyz).

George-Paul B.
fonte
6

use o método .not () e verifique se há um atributo:

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

Verifique aqui: http://jsfiddle.net/AWb79/

Matthew Cira
fonte
8
Isso está completamente errado. Os colchetes não são para classes, mas são usados ​​para seletores que identificam atributos.
Misterparker
1
Na verdade, está completamente certo. A '[classe]' está identificando corretamente o atributo de (não) ter uma classe.
Deborah
Classes @Misterparker são atributos.
Matthew Cira
Isso verifica se o atributo está presente, não o caso se um elemento tem uma classe específica, como em valor de classe
Mark
6

Você pode tentar isso:

<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.
});
aeronave
fonte
Esta resposta não agrega valor à página, foi publicada 7 anos atrás. Nunca publique conteúdo apenas com código e duplicado.
Mckmackusa 28/06/19
0

lendo esses 6 anos depois e pensei que eu também daria uma olhada nele, também na veia TIMTOWTDI ...: D, esperando que não fosse uma 'etiqueta JS' incorreta.

Eu costumo configurar um var com a condição e depois refiro-o mais tarde .. ou seja;

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

Embora eu deva mencionar que faço isso porque uso principalmente o operador ternário condicional e quero código limpo. Então, neste caso, tudo que eu teria é o seguinte:

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

... em vez disso:

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

Não sei por que, mas a resposta aceita não funcionou para mim. Em vez disso, funcionou:

if ($(this).hasClass("test") !== false) {}
Aljoša
fonte
Na verdade, isso verifica se a classe "test" possui. Para verificar se NÃO possui a classe "test", você precisará ter "=== false" ou "! == true" em vez de "! == false".
Lisa Cerilli 18/03