Removendo várias classes (jQuery)


615

Existe alguma maneira melhor de reescrever isso:

$('element').removeClass('class1').removeClass('class2');

Não posso usar removeClass();, pois removeria TODAS as classes, o que não desejo.

Respostas:


1128
$("element").removeClass("class1 class2");

De removeClass(), o parâmetro de classe:

Uma ou mais classes CSS para remover dos elementos, são separadas por espaços.



19

.removeClass()documentação jQuery .

Uma ou mais classes CSS para remover dos elementos, são separadas por espaços.


17

A documentação diz:

class (Optional) String
Uma ou mais classes CSS para remover dos elementos, são separadas por espaços.

Exemplo:

Remova a classe 'blue' e 'under' dos elementos correspondentes.

$("p:odd").removeClass("blue under");

12

Existem muitas maneiras de fazer isso!

jQuery

  1. remover toda a classe
    $("element").removeClass();
    OR
    $("#item").removeAttr('class');
    OR
    $("#item").attr('class', '');
    OR
    $('#item')[0].className = '';

  2. remover multi classe
    $("element").removeClass("class1 ... classn");
    OR
    $("element").removeClass("class1").removeClass("...").removeClass("classn");

Javascript de baunilha

  1. remover toda a classe

// remove all items all class  
const items = document.querySelectorAll('item');
for (let i = 0; i < items.length; i++) {
    items[i].className = '';
}

  1. remover multi classe

// only remove all class of first item
const item1 = document.querySelector('item');
item1.className = '';


2

Classes separadas por branco space

$('element').removeClass('class1 class2');

1

Você deve separar as classes que deseja remover por espaço em branco$('selector').removeClass('class1 class2');


0

Desde o jQuery 3.3.0 , é possível passar matrizes para .addClass(),. removeClass()e toggleClass(), o que facilita se houver alguma lógica que determine quais classes devem ser adicionadas ou removidas, pois você não precisa mexer nas seqüências delimitadas por espaço.

$("div").removeClass(["class1", "class2"]); 
Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.