要素のクリア

要素からすべてを削除する関数 clear(elem) を作成してください。

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

<script>
  function clear(elem) { /* your code */ }

  clear(elem); // clears the list
</script>

最初に、どのようにしないかを見てみましょう

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

これは機能しません。remove() を呼び出すと elem.childNodes コレクションがシフトするため、要素は常にインデックス 0 から始まります。しかし、i は増え続け、いくつかの要素はスキップされます。

for..of ループでも同じことが起こります。

正しいバリアントは次のとおりです

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

また、同じことを行うより簡単な方法もあります

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