Προσθήκη κλάσης σε στοιχείο στο jQuery
Υπενθυμίζω ότι στο χαρακτηριστικό
class
στον κώδικα HTML μπορούμε να γράψουμε πολλές
κλάσεις χωρισμένες με κενό.
Ας φανταστούμε την ακόλουθη κατάσταση - θέλετε
να προσθέσετε μια νέα κλάση στις υπάρχουσες, χωρίς να τις
αντικαταστήσετε. Σε αυτήν την περίπτωση, απλά να κάνετε
.attr('class', 'new-class')
δεν θα λειτουργήσει (χρησιμοποιώντας τη μέθοδο
attr)
- θα αντικαταστήσετε τις κλάσεις που
ήδη υπάρχουν στο χαρακτηριστικό.
Μπορείτε, φυσικά, πρώτα να διαβάσετε τις κλάσεις,
που υπάρχουν εκεί, μετά να προσθέσετε σε αυτές τη δική μας
κλάση χωρισμένη με κενό και να γράψετε όλα πίσω
στο χαρακτηριστικό, αλλά υπάρχει ένας πιο εύκολος τρόπος - στο jQuery
για τέτοιες περιπτώσεις προβλέπεται η μέθοδος
addClass.
Η μέθοδος addClass επιτρέπει την προσθήκη
μιας κλάσης σε ένα στοιχείο (ή σε στοιχεία), χωρίς να αντικαταστήσει
άλλες κλάσεις. Η κλάση που
θέλετε να προσθέσετε στο στοιχείο, λαμβάνεται ως
παράμετρος αυτής της μεθόδου.
Στο επόμενο παράδειγμα έχουμε ένα στοιχείο με
δύο κλάσεις - class="www zzz":
<p class="www zzz" id="test">text</p>
Μπορούμε να προσθέσουμε σε αυτό μια τρίτη κλάση -
kkk. Ως αποτέλεσμα, τα περιεχόμενα του χαρακτηριστικού
θα γίνουν έτσι - class="www zzz kkk":
$('#test').addClass('kkk');
Ο κώδικας HTML θα γίνει έτσι:
<p class="www zzz kkk" id="test">text</p>
Προσθέστε σε όλα τα li την κλάση test.
