元素创建的三种方式

创建元素的三种方式

1 document.write()

document.write('新设置的内容<p>标签也可以生成</p>');

2 innerHTML

var box = document.getElementById('box');
box.innerHTML = '新内容<p>新标签</p>';

3 document.createElement()

var div = document.createElement('div');
document.body.appendChild(div);

4 性能问题

innerHTML方法由于会对字符串进行解析，需要避免在循环内多次使用。

可以借助字符串或数组的方式进行替换，再设置给innerHTML

优化后与document.createElement性能相近

5 案例

动态创建列表，高亮显示

根据数据动态创建表格

模拟百度搜索文本框