DOM——创建元素的三种方式

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性能相近

案例

  • 动态创建列表,高亮显示

  • 根据数据动态创建表格

 

猜你喜欢

转载自www.cnblogs.com/superjishere/p/11748520.html