document.write()
document.write('新設置的內容<p>標簽也可以生成</p>');
innerHTML
var box = document.getElementById('box');
box.innerHTML = '新內容<p>新標簽</p>';
document.createElement()
var div = document.createElement('div');
document.body.appendChild(div);
性能問題
-
innerHTML方法由於會對字符串進行解析，需要避免在循環內多次使用。
-
可以借助字符串或數組的方式進行替換，再設置給innerHTML
-
優化后與document.createElement性能相近
案例
-
動態創建列表，高亮顯示
-
根據數據動態創建表格