dom_dom0800_008

大量のDOM要素を追加する際は、( A )を使うとパフォーマンスが低下する可能性があり、効率化のため( B )を用いるのが良い。

解答

A: innerHTML
B: DocumentFragment

解説

innerHTMLは一度に大量のHTML文字列をパースする必要があり、効率が悪い。DocumentFragmentでの一括挿入が推奨される。

使用例(サンプルコード)

[ javascript ]

const fragment = document.createDocumentFragment();
for (let i = 0; i < 1000; i++) {
  const div = document.createElement("div");
  div.textContent = `Item ${i}`;
  fragment.appendChild(div);
}
container.appendChild(fragment);