jQuery: differenza tra remove() ed empty()

La differenza tra remove() ed empty() è che mentre la prima funzione rimuove l’elemento selezionato dalla pagina e quindi non è più presente, controllare dall’ispettore degli elementi per credere, la seconda funzione semplicemnte lo svuota lasciandolo però all’interno della pagina stessa. Sarà necessario quindi inserire nella pagina due paragrafi a cui metteremo un bordino rosso con un css:

p {border: 1px solid red; }
...
<p id="remove">Questo paragrafo sparisce con la funzione remove()</p>
<p id="empty">Questo paragrafo si svuota con la funzione empty()</p>

Il primo lo rimuoveremo dalla pagina direttamente cliccandoci sopra, mentre il secondo verrà svuotato e quindi resterà solo il bordo rosso nella pagina:

$(document).ready(function() {
$('p#remove').click(function() {
$(this).remove();
});
$('p#empty').click(function() {
$(this).empty();
});
});

L’esempio