DocumentFragment

这里讲解DocumentFragment。

//主体部分
    <ul id="old"></ul>

    <ul id="new"></ul>

<script>
    var Old=document.getElementById('old');
    var New=document.getElementById('new');

    function old_function(){
        for(var i=0;i<500;i++){
            var Oli=document.createElement('li');
            Old.appendChild(Oli);
        }
    }
    console.time('old_function');
    console.timeEnd('old_function');

   function new_function(){
       var frag=document.createDocumentFragment();//创建了碎片
       for(var i=0;i<500;i++){
           var Nli=document.createElement('li');
          frag.appendChild(Nli);//frag是个临时的变量 减少了每次访问new
       }
       New.appendChild(frag);
   }
    console.time('new_function');
    console.timeEnd('new_function');
</script>

用了碎片的时间减少了