js用计时器加载大量dom

改进前：

 <table><tbody></tbody></table>

?

1 2 3 4 5 6 7 8 9 10

var tbody=document.getElementsByTagName("tbody")[0];         for(var i=0;i<20000;i++){             var tr=document.createElement("tr");             for(var t=0;t<6;t++){                 var td=document.createElement("td");                 td.appendChild(document.createTextNode(i+","+t));                 tr.appendChild(td);             }             tbody.appendChild(tr);         }

 改进后：

   var rowCount=20000;
      var divideInto=100;
      var chunkSize=rowCount/divideInto;
      var iteration=0;


        var tbody=document.getElementsByTagName("tbody")[0];

        setTimeout(function generateRows() {
            var base=(chunkSize)*iteration;
                for (var i = 0; i < chunkSize; i++) {
                    var tr = document.createElement("tr");
                    for (var t = 0; t < 6; t++) {
                        var td = document.createElement("td");
                        td.appendChild(document.createTextNode(
                            (i+base) + "," + t+","+iteration
                            )
                        );
                        tr.appendChild(td);
                    }
                    tbody.appendChild(tr);
                }
                iteration++;
                if(iteration<divideInto){
                    setTimeout(generateRows,50);
                }
            }, 0);