Creación de enlaces para eliminar elementos en JavaScript
Supongamos que ahora tenemos muchos párrafos:
html<div id="parent">
<p>text1</p>
<p>text2</p>
<p>text3</p>
</div>
Hagamos que a cada párrafo se le agregue un enlace para eliminarlo al final.
Para empezar, implementemos la adición de enlaces:
javascriptlet elems = document.querySelectorAll('#parent p');
for (let elem of elems) {
let remove = document.createElement('a');
remove.href = '';
remove.textContent = 'remove';
elem.appendChild(remove);
}
Ahora hagamos que al hacer clic en el enlace, se elimine el párrafo correspondiente:
javascriptlet 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();
});
}
Задание 1
Dada una etiqueta ul. Agregue al final de cada
etiqueta li un enlace para eliminar este li
de la lista.
Задание 2
Dada una tabla HTML. Agregue una columna adicional en la que para cada fila de la tabla haya un enlace para eliminar esa fila.