Δημιουργία και τυλίγμα στοιχείων στο jQuery

Πριν από το τύλιγμα με μια ετικέτα, μπορούμε πρώτα να δημιουργήσουμε ένα στοιχείο στο έγγραφο. Ας τυλίξουμε τις παραγράφους που παρουσιάζονται παρακάτω στις ετικέτες '<div></div>':

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

Για αυτό μπορούμε να δημιουργήσουμε πρώτα ένα στοιχείο στο έγγραφο χρησιμοποιώντας document.createElement('div'):

javascript$('.www').wrap(document.createElement('div'));

Ή:

javascriptlet div = document.createElement("div");
$('.www').wrap(div);

Ως παράμετρο μπορούμε να περάσουμε όχι μόνο το όνομα της ετικέτας, αλλά και μια τέτοια κατασκευή - '<div></div>' - σε αυτήν την περίπτωση το αποτέλεσμα θα είναι ακριβώς το ίδιο:

javascript$('.www').wrap('<div></div>');

Ο κώδικας HTML θα γίνει έτσι:

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

Όταν χρησιμοποιείται ο δεύτερος τρόπος, στην ετικέτα ανοίγματος (στην περίπτωσή μας '<div>') μπορούμε να γράψουμε οποιαδήποτε χαρακτηριστικά, ενώ το τύλιγμα θα γίνεται μαζί με αυτά τα χαρακτηριστικά.

Ας τυλίξουμε τις παραγράφους μας με ένα div με κλάση zzz:

javascript$('.www').wrap('<div class="zzz"></div>');

Ο κώδικας HTML θα γίνει έτσι:

html<div class="zzz"><p class="www">κείμενο</p></div>
<div class="zzz"><p class="www">κείμενο</p></div>
<div class="zzz"><p class="www">κείμενο</p></div>
<p>κείμενο</p>