Selvsletting av nye elementer i JavaScript
I forrige leksjon lærte vi hvordan vi kan gjøre slik at elementer sletter seg selv ved et klikk.
La oss nå anta at det ikke er noen elementer i forelderen fra starten:
<div id="parent"></div>
La oss i en løkke opprette 9 nye avsnitt,
og samtidig gjøre slik at ethvert avsnitt slettes
ved å klikke på det:
let parent = document.querySelector('#parent');
for (let i = 1; i <= 9; i++) {
let p = document.createElement('p');
p.textContent = i;
p.addEventListener('click', function() {
this.remove();
});
parent.appendChild(p);
}
Følgende kode er gitt:
<ul id="parent">
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
<input type="submit" id="button">
Gjør slik at ved et klikk på knappen legges det til
et nytt element i listen. Gjør
slik at enhver li slettes ved å klikke på
den. Dette gjelder både de li-ene som allerede
finnes i listen, og de nye, som er opprettet etter
at knappen er trykket på.
