Metodo removeChild

Il metodo removeChild consente di rimuovere un elemento. Viene applicato all'elemento genitore specificando l'elemento da rimuovere.

Sintassi

javascriptgenitore.removeChild(elemento);

Esempio

Rimuoviamo il paragrafo #elem. Per fare ciò otteniamo il suo genitore #parent e applichiamo il metodo removeChild al genitore ottenuto, e passiamo come parametro del metodo l'elemento che vogliamo rimuovere:

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);

Risultato dell'esecuzione del codice:

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

Esempio

Se è necessario rimuovere un elemento, ma non si ha un riferimento al suo genitore, - il genitore può essere ottenuto tramite parentElement:

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

Risultato dell'esecuzione del codice:

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

Vedi anche

  • metodo remove,
    che può essere utilizzato per rimuovere un elemento