¿Cómo verificar si un elemento NO tiene una clase específica?

232

¿Cómo verifico si no hay una clase? Por ejemplo, sé cómo verificar si tiene la clase "prueba", pero ¿cómo verifico si no tiene la clase "prueba"?

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

Respuestas:

484
if (!$(this).hasClass("test")) {
sdleihssirhc
fuente
34
En el sentido de TIMTOWTDI, aquí hay una solución horrible: if($(this).is(":not(.test)"))> :)
Phrogz
66
TIMTOWTDIBSCINABTE
Fizzix
25
En caso de que alguien se pregunte: hay más de una forma de hacerlo, pero a veces la consistencia tampoco es algo malo.
Capitán Hipertexto
145

La respuesta de sdleihssirhc es, por supuesto, la correcta para el caso en la pregunta, pero solo como referencia si necesita seleccionar elementos que no tienen una clase determinada, puede usar el selector no :

// select all divs that don't have class test
$( 'div' ).not( ".test" );
$( 'div:not(.test)' );  // <-- alternative 
JJJ
fuente
8
En mi humilde opinión, su respuesta es la mejor. Si la respuesta de sdleihssirhc es correcta, esta pregunta no tiene nada que ver con jQuery y se formularía mejor como 'dada alguna condición, ¿cómo pruebo que esa condición NO es verdadera en Javascript'? Lo que queremos con jQuery es operar en colecciones enteras de elementos DOM tan fácil como podamos en objetos individuales. Su respuesta proporciona justamente esa solución. +1
Stijn de Witt
1
@byronyasgur En el contexto de la pregunta original, el afiche quería probar si cierto elemento conocido no tenía la clase. Este código selecciona todos los elementos que no tienen la clase, por lo que no resolvería el problema del póster. No recuerdo por qué publiqué esto en primer lugar.
JJJ
14

Seleccione el elemento (o grupo de elementos) que tenga la clase "abc", que no tenga la clase "xyz":

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

Al seleccionar CSS normal puede usar .abc:not(.xyz).

George-Paul B.
fuente
6

usa el método .not () y busca un atributo:

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

Compruébelo aquí: http://jsfiddle.net/AWb79/

Matthew Cira
fuente
8
Esto está completamente mal. Los corchetes no son para clases sino que se usan para selectores que identifican atributos.
Misterparker
1
En realidad es completamente correcto. La '[clase]' está identificando correctamente el atributo de (no) tener una clase.
Deborah el
Las clases de @Misterparker son atributos.
Matthew Cira
esto verifica si el atributo está presente, no el caso si un elemento tiene una clase específica, como en el valor de la clase
Marque el
6

Puedes probar esto:

<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
fuente
Esta respuesta no agrega ningún valor a la página, se publicó 7 años antes. Nunca publique contenido de solo código y duplicado.
mickmackusa
0

Después de leer esto 6 años más tarde, pensé que también podría hacerlo, también en la línea TIMTOWTDI ...: D, con la esperanza de que no sea una "etiqueta JS" incorrecta.

Normalmente configuro una var con la condición y luego me refiero a ella más adelante ... es decir;

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

Aunque debo mencionar que hago esto porque uso principalmente el operador ternario condicional y quiero un código limpio. Entonces, en este caso, todo lo que tendría es esto:

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

...en lugar de esto:

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

No sé por qué, pero la respuesta aceptada no funcionó para mí. En cambio, esto funcionó:

if ($(this).hasClass("test") !== false) {}
Aljoša
fuente
Esto realmente comprueba si TIENE clase "prueba". Para verificar si NO tiene la clase "prueba", necesitaría tener "=== falso" o "! == verdadero" en lugar de "! == falso".
Lisa Cerilli