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) } }
时间: 2024-10-15 05:16:56