Javascript-DOM重画方法是否同步？

在我的问题中，DOM重画方法是那些修改DOM并使浏览器重画页面的方法。例如：

const newChildNode = /*...*/;

document.body.appendChild(newChildNode);

const newHeight = document.body.scrollHeight;

这段代码在正常情况下运行良好，但我不太确定它在高压条件下的行为，比如当有这么多请求重新绘制页面时。我可以假设当执行

document.body.scrollHeight

时，

newChildNode

已经在屏幕上可见吗？

我们可以将这个“重画”过程分为三个部分，DOM更新、回流、重绘

所有这些操作都不遵循相同的规则：

DOM更新：始终同步。DOM只是另一个js对象，其操作方法都是同步的

回流：这就是你偶然发现的怪兽。这是重新计算页面上元素的所有框位置。
一般来说，浏览器会等到您完成所有DOM修改，从而结束js流，然后再触发它。
但是一些DOM方法会同步地强制执行此操作。e、 g，所有

HTMLElement.offsetXXX

和类似的属性，或

元素.getBoundingClientRect

，或在文档的

节点中访问.innerText

或访问

getComputedStyle

返回对象（，可能还有其他）的某些属性将触发同步回流，以获得更新的值。因此，使用这些方法/属性时要小心

---

重新绘制：实际将内容传递到渲染引擎时。规范中没有说明何时会发生这种情况。大多数浏览器会等待下一次屏幕刷新，但并不是说它会一直这样。e、 g.众所周知，当您使用

alert（）

阻止脚本执行时，Chrome不会触发它，而Firefox会。

是的，它们是同步的“…在屏幕上已经可见？”-在所有JS完成执行之前，屏幕不会重新绘制，但DOM将同步更新。“众所周知，Chrome不会触发它..Fireox“人们是怎么发现这些东西的？谁知道这些东西，或者一个人是如何获得这些知识的？你订阅了哪些资源？只是问一下，这样我也可以订阅它们。@Arjang回答StackOverflow问题有助于在实现或规范本身中找到各种各样的奇怪之处、浏览器怪癖和bug；-）例如，我注意到有一个，但后来我把它挖了出来，中间有一个