三种动态创建元素的区别
document.write() (不常用） 直接将内容写入页面的内容流，但如果文档流加载完毕，再调用这句话，会导致整个页面全部重绘（即以前所写内容消失）element.innerHtml 将内容写入某个DOM节点，不会导致页面重绘 此方法创建多个元素的效率会更高一些（不要拼接字符串，采取数组形式拼接），结构稍微复杂document.creatElement（） 此方法创建多个元素效率稍微低一些，但结构清晰
<body>
<div class=
"inner"></div>
<div class=
"create"></div>
<script>
//2.inner.HTML
var inner = document.
querySelector(".inner");
for
(var i = 0
; i <= 100
; i++) {
inner.innerHTML +=
'<a herf="#">百度</a>';
}
//inner.HTML 方式改进 ：用数组存储多个元素，最后将数组转换为字符串添加
var arr = []
;
for
(var i = 0
; i <= 100
; i++) {
arr.
push('<a herf="#">百度</a>');
}
inner.innerHTML = arr.
join("");
//3.document.creatElement （创建多个元素时效率很高）
var create = document.
querySelector(".create");
for
(var i = 0
; i <= 100
; i++) {
var a = document.
createElement("a");
create.
appendChild(a
);
}
</script>
</body>
不同浏览器下，innerHTML 如果采取数组的形式 ，效率会比 creatElement更高
