Hinzufügen einer Klasse zu einem Element in jQuery
Ich erinnere daran, dass im Attribut
class
im HTML-Code mehrere
Klassen durch Leerzeichen getrennt geschrieben werden können.
Stellen wir uns eine solche Situation vor - Sie möchten
eine neue Klasse zu den vorhandenen hinzufügen, ohne
diese dabei zu überschreiben. In diesem Fall wird es nicht funktionieren,
einfach .attr('class', 'new-class')
zu machen (indem man die Methode
attr verwendet)
- Sie würden die Klassen überschreiben, die
bereits im Attribut vorhanden sind.
Man könnte natürlich zuerst die Klassen auslesen,
die dort sind, dann unsere Klasse durch ein Leerzeichen
hinzufügen und alles zurück in das Attribut schreiben,
aber es gibt einen einfacheren Weg - in jQuery
gibt es für solche Fälle die Methode
addClass.
Die Methode addClass erlaubt es,
einem Element (oder Elementen) eine Klasse hinzuzufügen, ohne
dabei andere Klassen zu überschreiben. Die Klasse, die Sie
dem Element hinzufügen möchten, wird als Parameter dieser Methode übergeben.
Im folgenden Beispiel haben wir ein Element mit
zwei Klassen - class="www zzz":
<p class="www zzz" id="test">text</p>
Wir können ihm eine dritte Klasse hinzufügen -
kkk. Als Ergebnis wird der Inhalt des Attributs
so aussehen - class="www zzz kkk":
$('#test').addClass('kkk');
Der HTML-Code wird dann so aussehen:
<p class="www zzz kkk" id="test">text</p>
Fügen Sie allen li die Klasse test hinzu.