gpt4 book ai didi

javascript - 如何在运行密集的 JavaScript 时更新 DOM?

转载 作者:行者123 更新时间:2023-11-29 10:48:19 28 4
gpt4 key购买 nike

我正在编写 JavaScript,它正在为一个项目计数到一定数量。数量可能在 100,000 左右,完成处理大约需要 10-15 秒。我希望脚本在用户调用页面时立即运行,并在脚本完成时进行重定向。是否可以在运行时暂停 10 毫秒以更新 DOM 以提供诸如“仍在工作”之类的反馈?

我想避免使用 jQuery,在这种情况下网络 worker 不是一个选项。我意识到这不是真实世界的应用程序!

编辑:添加了一些代码作为示例:

在头部:

function myCounter (target) {
var t = target;
var count = 0;
while (t != count){
if (t == count) {
window.location.replace("http://example.com"); // redirect
}
count++;
}
}

在正文中:

<script>myCounter(100000);</script>

最佳答案

在大多数浏览器中,JavaScript 和 UI 在同一个线程中运行。您可以使用 setTimeout(或 setInterval)将线程返回给浏览器。

var myNumber = 0;
updateNumber();

function updateNumber(){
// do heavy work for great good, ideally divided into smaller chunks

document.getElementById('updateDiv').innerHTML = 'still working, up to ' + myNumber;

if(myNumber < limit) {
setTimeout(updateNumber, 20);
}
}

有关一般过程的更多详细信息,这个答案值得一读:https://stackoverflow.com/a/4575011/194940

关于javascript - 如何在运行密集的 JavaScript 时更新 DOM?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15126618/

28 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com