wake-up-neo.com

Wie entferne ich alle CSS-Klassen mit jQuery?

Anstatt $("#item").removeClass() für jede einzelne Klasse, die ein Element haben könnte, einzeln aufzurufen, gibt es eine einzelne Funktion, die aufgerufen werden kann, die alle CSS-Klassen aus dem angegebenen Element entfernt? 

Sowohl jQuery als auch Raw-JavaScript funktionieren.

javascriptjquerydom
714
Click Upvote
$("#item").removeClass();

Wenn Sie removeClass ohne Parameter aufrufen, werden alle Klassen des Elements entfernt.

Sie können auch verwenden (ist aber nicht unbedingt zu empfehlen, der richtige Weg ist der obige):

$("#item").removeAttr('class');
$("#item").attr('class', '');
$('#item')[0].className = '';

Wenn Sie jQuery nicht hatten, wäre dies so ziemlich Ihre einzige Option:

document.getElementById('item').className = '';
1396
jimyi

Bleib dran, removeClass () setzt standardmäßig nicht alle Klassen, wenn nichts Spezifisches angegeben ist. So

$("#item").removeClass();

wird es alleine tun ...

110
da5id

Na sicher.

$('#item')[0].className = '';
// or
document.getElementById('item').className = '';
13
kangax

Setzen Sie einfach das className-Attribut des realen DOM-Elements auf '' (nothing).

$('#item')[0].className = ''; // the real DOM element is at [0]

Edit: Andere Leute haben gesagt, dass nur das Anrufen von removeClass funktioniert - ich habe dies mit dem Google JQuery Playground getestet: http://savedbythegoog.appspot.com/?id=ag5zYXZlZGJ5dGhlZ29vZ3ISCxIJU2F2ZWRbG161GEM funktioniert. So kannst du es auch so machen:

$("#item").removeClass();
13
Isaac Waller

Die kürzeste Methode

$('#item').removeAttr('class').attr('class', '');
9
Yanni

Heh, suchte nach einer ähnlichen Antwort. Dann traf es mich.

Entfernen Sie bestimmte Klassen

$('.class').removeClass('class');

Sagen Sie, wenn das Element class = "class another-class" hat

8
Shawn Rebelo
$('#Elm').removeAttr('class');

klassen-Attr nicht mehr in "Elm" vorhanden sein.

4
uihelp

Sie können es einfach versuchen

$(document).ready(function() {
   $('body').find('#item').removeClass();
});

Wenn Sie auf dieses Element ohne Klassennamen zugreifen müssen, beispielsweise einen neuen Klassennamen hinzufügen, können Sie Folgendes tun:

$(document).ready(function() {
   $('body').find('#item').removeClass().addClass('class-name');
});

Ich verwende diese Funktion in meinem Projekt, um Klassen in einem HTML-Builder zu entfernen und hinzuzufügen. Viel Glück.

3
Alessandro Foolish Ciak DAnton

Ich mag es, native Js zu benutzen.

1.

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

2.

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

jQuery Möglichkeiten

  1. $("#item").removeClass();

  2. $("#item").removeClass("class1 ... classn");

2
xgqfrms

Da nicht alle Versionen von jQuery gleich erstellt werden, kann es sein, dass Sie dasselbe Problem wie ich ausführen. Dies bedeutet, dass Sie $ ("# item") aufrufen. entfernt tatsächlich nicht die Klasse. (Wahrscheinlich ein Fehler)

Eine zuverlässigere Methode ist die Verwendung von rohem JavaScript und das Entfernen des Klassenattributs.

document.getElementById("item").removeAttribute("class");
1
Vincent

versuchen Sie es mit removeClass

Zum Beispiel :

var nameClass=document.getElementsByClassName("clase1");
console.log("after", nameClass[0]);
$(".clase1").removeClass();
var nameClass=document.getElementsByClassName("clase1");
console.log("before", nameClass[0]);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="clase1">I am Div with class="clase1"</div>

1
x-rw

Verwenden wir dieses Beispiel. Möglicherweise möchten Sie, dass der Benutzer Ihrer Website weiß, dass ein Feld gültig ist, oder dass es durch Ändern der Hintergrundfarbe des Felds Aufmerksamkeit erfordert. Wenn der Benutzer auf reset stößt, sollte Ihr Code nur die Felder zurücksetzen, die Daten enthalten, und sich nicht die Mühe machen, jedes andere Feld auf Ihrer Seite durchzugehen. 

Dieser jQuery-Filter entfernt die Klasse "highlightCriteria" nur für die Eingabe- oder Auswahlfelder, die diese Klasse haben.

$form.find('input,select').filter(function () {
    if((!!this.value) && (!!this.name)) {
        $("#"+this.id).removeClass("highlightCriteria");
    }
});
0
Greg Bologna