Η μέθοδος addClass

Η μέθοδος addClass προσθέτει μια δεδομένη CSS κλάση σε ένα στοιχείο.

Σύνταξη

Μία CSS κλάση:

javascript$(επιλογέας).addClass(όνομα CSS κλάσης);

Πολλαπλές CSS κλάσεις (ως συμβολοσειρά):

javascript$(επιλογέας).addClass('κλάση1 κλάση2 κλάση3 ...');

Πολλαπλές CSS κλάσεις (ως πίνακας):

javascript$(επιλογέας).addClass(['κλάση1', 'κλάση2', 'κλάση3', '...']);

Εφαρμογή συνάρτησης σε κάθε στοιχείο στο σύνολο:

javascript$(επιλογέας).addClass(function(αριθμός στο σύνολο, τρέχουσες CSS κλάσεις στοιχείου));

Παράδειγμα

Η παράγραφός μας δεν έχει καθόλου κλάσεις. Ας προσθέσουμε την κλάση www:

html<p id="test">κείμενο</p>

javascript$('#test').addClass('www');

Ο κώδικας HTML θα γίνει ως εξής:

html<p id="test" class="www">κείμενο</p>

Παράδειγμα

Η παράγραφός μας έχει ήδη μια κλάση. Ας προσθέσουμε την κλάση www:

html<p id="test" class="eee">κείμενο</p>

javascript$('#test').addClass('www');

Ο κώδικας HTML θα γίνει ως εξής:

html<p id="test" class="eee www">κείμενο</p>

Παράδειγμα

Η παράγραφός μας έχει ήδη δύο κλάσεις. Ας προσθέσουμε την κλάση www:

html<p id="test" class="eee ggg">κείμενο</p>

javascript$('#test').addClass('www');

Ο κώδικας HTML θα γίνει ως εξής:

html<p id="test" class="eee ggg www">κείμενο</p>

Παράδειγμα

Η παράγραφός μας έχει ήδη μια κλάση. Ας προσθέσουμε δύο ακόμη κλάσεις - www και ggg:

html<p id="test" class="eee">κείμενο</p>

javascript$('#test').addClass('www ggg');

Ο κώδικας HTML θα γίνει ως εξής:

html<p id="test" class="eee www ggg">κείμενο</p>

Δείτε επίσης