Creazione di collegamenti per l'eliminazione di elementi in JavaScript
Supponiamo ora di avere molti paragrafi:
<div id="parent">
<p>text1</p>
<p>text2</p>
<p>text3</p>
</div>
Facciamo in modo che a ogni paragrafo venga aggiunto un collegamento per la sua eliminazione alla fine.
Per iniziare, implementiamo semplicemente l'aggiunta dei collegamenti:
let elems = document.querySelectorAll('#parent p');
for (let elem of elems) {
let remove = document.createElement('a');
remove.href = '';
remove.textContent = 'remove';
elem.appendChild(remove);
}
Ora facciamo in modo che cliccando sul collegamento, venga eliminato il paragrafo corrispondente:
let elems = document.querySelectorAll('#parent p');
for (let elem of elems) {
let remove = document.createElement('a');
remove.href = '';
remove.textContent = 'remove';
elem.appendChild(remove);
remove.addEventListener('click', function(event) {
elem.remove();
event.preventDefault();
});
}
Dato il tag ul. Aggiungi alla fine di ogni
tag li un collegamento per eliminare questo li
dalla lista.
Data una tabella HTML. Aggiungici un'altra colonna, in cui per ogni riga della tabella ci sarà un collegamento per eliminare quella riga.