将元素添加到DOM树后，元素的维度是否可立即读取？

Question

假设我使用document.createElement动态创建了一个DIV，添加了一些内部文本，并希望确定其高度和宽度。我可以看到，在将DIV添加到DOM树之前，offsetWidth和offsetHeight等属性是0，这是意料之中的。一旦以编程方式将其添加到树中，我是否可以期望这些属性立即“就绪”，或者是否存在重绘/回流可能会被延迟并稍后发生的环境？

textDiv = document.createElement("div");
textDiv.innerHTML = "some dynamically created string";
console.log(textDiv.offsetWidth); // 0
document.body.appendChild(textDiv);
console.log(textDiv.offsetWidth); // OK?

我认为答案应该是这样的：“JavaScript解释器是单线程的，由appendChild触发的重绘/回流事件是该线程的一部分，并在继续下一条语句之前完成”……但是有人能检查一下我的理解吗？

这个Opera article有很多我正在寻找的东西，但不清楚它是如何特定于歌剧的。在任何情况下，应用程序开发人员似乎都可以假定在进行测量时会正确地进行任何所需的重绘/回流，例如通过访问offsetWidth。

Answer 1

一旦将元素添加到DOM中，就应该可以访问它，就像它从一开始就在那里一样。简单明了的DOM操作是同步的。

开始引入超时、间隔和Ajax时要小心。

Answer 2

据我所知，只有在所有javascript函数或属性对DOM树中已经存在的元素起作用后，它们才是可读的。

我尝试了这两种情况，结果证明效果很好：

<SCRIPT>
window.onload = function() {
textDiv = document.createElement("div");
textDiv.innerHTML = "some dynamically created string";
alert(textDiv.offsetWidth); // 0
document.body.appendChild(textDiv);
alert(textDiv.offsetWidth); // OK?
};

​