Μέθοδος add
Η μέθοδος add προσθέτει τα δοσμένα
στοιχεία σε ένα υπάρχον σύνολο στοιχείων.
Σύνταξη
Προσθήκη μέσω επιλογέα:
.add(επιλογέας);
Τα προστιθέμενα στοιχεία ορίζονται ως ένα ή περισσότερα (ως πίνακας) DOM στοιχεία:
.add(DOM στοιχείο);
Τα προστιθέμενα στοιχεία ορίζονται ως αντικείμενο jQuery:
.add(αντικείμενο jQuery);
Τα προστιθέμενα στοιχεία ορίζονται ως κείμενο html:
.add(κείμενο html);
Τα προστιθέμενα στοιχεία αναζητούνται στη σελίδα χρησιμοποιώντας τον δοσμένο επιλογέα, μέσα στην περιοχή που ορίζεται από τη δεύτερη παράμετρο. Η περιοχή αναζήτησης μπορεί να οριστεί ως DOM στοιχείο, αντικείμενο jQuery ή αντικείμενο εγγράφου:
.add(επιλογέας, περιβάλλον);
Παράδειγμα
Ας βρούμε όλες τις παραγράφους, ας βάλουμε στο τέλος τους
το κείμενο '!', μετά ας προσθέσουμε στις παραγράφους που βρέθηκαν
τους τίτλους h2
και ταυτόχρονα για τους τίτλους και τις παραγράφους
ας ορίσουμε κόκκινο χρώμα:
<div>ddd</div>
<h1>hhh</h1>
<p>ppp</p>
<div id="test"><h2>hhh</h2></div>
<p>ppp</p>
<h2>hhh</h2>
<p>ppp</p>
$('p').append('!').add('h2').css('color', 'red');
Παράδειγμα
Ας εισάγουμε ένα περιβάλλον αναζήτησης - ας προσθέσουμε
μόνο εκείνα τα h2, που βρίσκονται μέσα στο στοιχείο
#test:
let $context = $('#test');
$('p').append('!').add('h2', $context).css('color', 'red');
Παράδειγμα
Ας δημιουργήσουμε ένα περιβάλλον αναζήτησης ως DOM στοιχείο
χρησιμοποιώντας τη JavaScript μέθοδο
querySelector:
let context = document.querySelector('#test');
$('p').append('!').add('h2', context).css('color', 'red');
Παράδειγμα
Στις περισσότερες περιπτώσεις μπορούμε να κάνουμε χωρίς το περιβάλλον, απλά φτιάχνοντας έναν πιο πολύπλοκο επιλογέα:
$('p').append('!').add('#test h2').css('color', 'red');
