Question

如果我向DOM添加元素，那么更改是否立即？如果我在代码的下一行中删除相同的元素，该元素是否会出现在屏幕上（短时间内）？或者当前浏览器周期结束时显示是否会更新？

Answer 1

无论您的机器有多快，它都不会显示出来。 Javascript将完成阻止UI直到完成。

试试这个

HTML

<div id='d'></div>

JS

var d = document.getElementById('d');
var p = document.createElement('p');

p.innerText = "One";
d.appendChild(p);

for (i = 0; i < 1000000; i++) {
  for (z = 0; z < 10; z++){
    // this is nonsense that runs for a sec or two to block the JS thread
    // please never do this in production
  }
}

p.innerText = "Two"

会暂停您的浏览器，然后显示Two ...从不One

Answer 2

显然元素的出现取决于CPU的功能，浏览器算法，图形卡渲染时间，监视频率等诸多因素。但是，程序（例如JavaScript）可以通过无误地考虑虚拟元素来继续操作。

另一方面，浏览器算法可以决定逐行渲染代码。作为一种经验，如果你运行一个沉重的循环来附加物品到身体，Opera浏览器会逐个显示项目，但Chrome将在循环结束时呈现页面。但是，如果您使用JavaScript setTimeout 进行循环，则在所有浏览器中，您将看到逐个显示的元素。

在同一浏览器滴答周期中对DOM进行了多处更改

2 个答案: