DIV CSS 佈局教程網

web端在進行大量DOM數據插入的時候，如果一次性插入上千條數據，浏覽器吃不消會出現卡頓假死的情況，代碼如下：

var arr = [];
for(var i = 0; i < 1000; i++){
    arr.push(i);
}

var loadData = function(data){
    for(var i = 0, l = data.length; i < l; i++){
        var elem = document.createElement('div');
        div.innerHTML = i;
        document.body.appendChild(div);
    }
};

loadData(arr);

//創建timeChunk()函數分批插入DOM
var timeChunk = function(data, fn, count, interval ){) //data數據 fn執行的邏輯函數 count一次插入的數量 interval分批執行的時間
    var obj,t;
    var len = arr.length;
    var start = function(){
        for(var i = 0; i < Math.min(count || 1, arr.length), i++){
            var obj = arr.shift();
            fn(obj);
        }
    };
    return function(){
        t = setInterval(function(){
            if(arr.length === 0){
                return clearInterval(t);
            }
        }, interval)
    }
}