10.5 Ta bort element
Detta exempel visar hur man kan ta bort ett element ur HTML-strukturen.
4 min.
Sammanfattning
Man kan använda antingen removeChild()
eller remove()
, varav det sista är enklast. Man utgår från det element som ska tas bort och lägger till metoden, t.ex. elem.remove()
.
Egna övningar
I test.html finns de två listor som fanns i övningen i ex10.1 och du ska skriva kod i test.js. Där finns redan lite kod baserat på den tidigare övningen, så bygg vidare på denna kod.
- I det här fallet finns ingen rubrik för listan med grönsaker, så skapa ett nytt h3-element med texten Grönsaker och lägg in det ovanför listan.
- Då man klickar på en frukt lägger du in en kopia av elementet sist i listan med grönsaker. Klickar man på en grönsak lägger du in en kopia av elementet först i listan av frukter. Du behöver inte lägga in några händelselyssnare på de nya elementen.
- Lägg till kod, så att den frukt eller grönsak man klickat, tas bort från den ursprungliga listan.