起因,写了两个html页面,body中只有div块,将div个数从1百加到1千后在浏览器中调试显示加载时间DOMContentLoaded:50ms左右(两者区别不大),加到1万后,页面1显示500ms左右,页面2显示100ms左右。
求解:在可预见的情况下,直接写好html元素和用js插入html元素在各方面的对比。
页面1:
<!DOCTYPE html> <html> <body> <div>hello world</div> .......... ....... .... <div>hello world</div> </body> </html>
页面2:
<!DOCTYPE html> <html> <body> <div id="div1">hello world</div> </body> <script> for(var i=0;i<9999;i++){ var div = document.createElement("div"); var node = document.createTextNode("hello world"); div.appendChild(node); var element =document.getElementById('div1'); element.appendChild(div); } </script> </html>