De removeChild Methode

De methode removeChild maakt het mogelijk om een element te verwijderen. Wordt toegepast op het ouderelement met specificatie van het element dat verwijderd moet worden.

Syntaxis

javascriptouder.removeChild(element);

Voorbeeld

Laten we de alinea #elem verwijderen. Hiervoor halen we de ouder #parent op en passen we de methode removeChild toe op de verkregen ouder, en geven we als parameter van de methode het element door dat we willen verwijderen:

html<div id="parent">
  <p id="elem">elem 1</p>
  <p>elem 2</p>
</div>
javascriptlet parent = document.querySelector('#parent');
let elem = document.querySelector('#elem');

parent.removeChild(elem);

Resultaat van de uitgevoerde code:

html<div id="parent">
  <p>elem 2</p>
</div>

Voorbeeld

Als je een element wilt verwijderen, maar er is geen referentie naar zijn ouder, - dan kan de ouder verkregen worden via parentElement:

html<div>
  <p id="elem">elem 1</p>
  <p>elem 2</p>
</div>
javascriptlet elem = document.querySelector('#elem');
elem.parentElement.removeChild(elem);

Resultaat van de uitgevoerde code:

html<div id="parent">
  <p>elem 2</p>
</div>

Zie ook

  • methode remove,
    waarmee je een element kunt verwijderen