JavaScript 디자인 모델 및 개발 실습:시간제 함수

1637 단어
웹 쪽에서 대량의 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)
    }
}

좋은 웹페이지 즐겨찾기