torna alle lezioni

Ripulisci l'elemento

importanza: 5

Crea una funzione clear(elem) che rimuova tutto da un elemento.

<ol id="elem">
  <li>Hello</li>
  <li>World</li>
</ol>

<script>
  function clear(elem) { /* il tuo codice */ }

  clear(elem); // Ripulisce la lista
</script>

Prima, vediamo come non farlo:

function clear(elem) {
  for (let i=0; i < elem.childNodes.length; i++) {
      elem.childNodes[i].remove();
  }
}

Questo non funziona perché la chiamata a remove() muove la collezione elem.childNodes, quindi gli elementi partono ogni volta dall’indice 0. Ma i aumenta, perciò alcuni elementi verranno saltati.

Il loop for..of fa lo stesso.

La corretta variante potrebbe essere:

function clear(elem) {
  while (elem.firstChild) {
    elem.firstChild.remove();
  }
}

C’è un modo più semplice per fare lo stesso:

function clear(elem) {
  elem.innerHTML = '';
}