标签：day09 pageCount -- arr 不卡顿 li let cortotal total

文章目录

• • 示例

示例

<script type="text/javascript">
 	// 记录任务开始时间
     let now = Date.now();
	// 插入十万条数据
	const total = 100000;
	// 一次插入 20 条	
	let once = 20;
	//总页数
	let page = total / once;
	//每条记录的索引
	let index =	0;
	// 获取容器
	let ul = document.querySelector("ul");
	
	function lookup(cortotal,corindex){
		if(cortotal <= 0){
			return false;
		}
		//每页多少条
		let pageCount = Math.min(cortotal,once);
        
		window.requestAnimationFrame(()=>{      // 等同于setTimeout(()=>{fun()},1000/60)
			// 将数据插入容器中
            let arr=[]
			for (let i = 0; i < pageCount; i++) {
				let li = document.createElement('li');
				li.innerHTML = corindex + i +":" + ~~(Math.random() * total) //~~去反两次 得到没有小数点的本身
				arr.push(li)
			}
            ul.appendChild(...arr)
			 lookup(cortotal - pageCount , corindex + pageCount );//回调显示全部
		})
	}
	lookup(total,index);

</script>

标签：day09,pageCount,--,arr,不卡顿,li,let,cortotal,total
来源： https://blog.csdn.net/qq_42451776/article/details/118786108

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。