Question

我正在运行O(N^4)任务。不是在谈论细节 - 我想在第一个循环中更新DOM。 伪代码是这样的：

for (var a = 0; a < lim; a++) {
  updateDOM();

  for (var a = 0; a < lim; a++) {
    for (var a = 0; a < lim; a++) {
      for (var a = 0; a < lim; a++) {
        ...
      }
    }
  }
}

现在的问题是updateDOM()被调用但从未呈现适当的DOM更改。所有计算都需要几秒钟。

我的解决方案：

使用网络工作者
的setTimeout

我没有对它们中的任何一个进行测试，但怀疑他们会解决这个问题。在这种情况下，我将不胜感激。

Answer 1

要么解决问题。问题是只要脚本正在运行，浏览器就不会发生任何其他事情。在您的功能结束之前，浏览器根本不会显示任何更新。

使用setTimeout您只需退出您的功能，让浏览器显示更新，然后让超时再次启动，以便您可以从上次停止的地方继续。

示例：

function loop(a) {
    for (var b = 0; b < 10000000; b++) {}
    $('div').text(a);
    a++;
    if (a < 1000) {
        window.setTimeout(function(){ loop(a); }, 0);
    }
}

loop(0);

演示：http://jsfiddle.net/Guffa/47FMM/

如何在密集型任务中呈现DOM更改？

1 个答案: