javascript前台优化优化之documentFragment对象

documentFragment对象：无父窗口的文档对象（或者叫文档碎片）

作用：javascript在操作DOM时都会重新加载整个文档的DOM为了减少DOM操作可以在操作DOM(为其添加或删除属性时)可以将DOM放入documentFragment中，最后一次性操作文档碎片

说白了documentFragment就是缓冲区：buffer

var oui=document.getelementbyid("oitem"); 
for(var i=0;i<10;i++) 
{ 
var oli=document.createelement("li"); 
oui.appendchild(oli); 
oli.appendchild(document.createtextnode("item"+i)); 
} 


上面的代码在循环中调用了oui.appendchild（oli），每次执行这条语句后，浏览器都会更新页面。其次下面的oui.appendchild()添加了文本节点，也要更新页面。所以一共要更新页面20次。 
为了页面的优化，我们要尽量减少dom的操作，将列表项目在添加文本节点之后再添加，并合理地使用creatdocumentfragment(),代码如下：
var oui=document.getelementbyid("oitem"); 
var ofragment=document.createdocumentfragment(); 
for(var i=0;i<10;i++){ 
var oli=document.createelement("li"); 
oli.appendchild(document.createtextnode("item"+i)); 
ofragment.appendchild(oli); 
} 
oui.appendchild(ofragment);