創建1000個webqq的qq好友列表, 一個好友用一個節點來表示

* timeChunk

var timeChunk = function(a, fn, sz, done) {var obj, t, len = a.length;var start = function() {for (var i = 0; i < Math.min(sz || 1, a.length); i++) {var obj = a.shift();fn.call(this, obj);}}return function() {t = setInterval(function() {// 如果全部節點都已經被創建好if (a.length === 0) {var i = clearInterval(t)typeof done === "function" && done.call(this);return i;}start();}, 200);} }/*** Pad a string to a certain length with another string*/ function str_pad(input, pad_length, pad_string) {var i = String.valueOf()(input);var n = pad_length - i.length;if (n <= 0)return i;var s = pad_string || "0";while (n--) {i = s + i;}return i; }// test var ary = []; for (var i = 1; i <= 1000; i++) {ary.push(i); }// 每次加載8個 var renderFriendsList = timeChunk(ary, function(n) {var div = document.createElement("div");div.innerHTML = "Friend-" + str_pad(n, 4);document.body.appendChild(div); }, 8, function() {var hint = document.createElement("p");hint.innerHTML = "好友列表加載完了";document.body.insertBefore(hint, document.body.querySelector("script")); });renderFriendsList();

　　

　　

Run:

?

?

轉載于:https://www.cnblogs.com/mingzhanghui/p/9408465.html

總結

以上是生活随笔為你收集整理的javascript 分时函数 分批次添加DOM节点 timeChunk的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。