我有一些 javascript 可以将元素添加到文档中。添加后我立即尝试获取元素的 clientWidth 和 clientHeight。但是,我看到与大小相关的所有属性都为 0。但稍后我注意到大小属性确实填充了实际大小值(最终)。
我如何知道添加的 Html 元素的尺寸详细信息何时可用? 我试过监听各种事件,例如 onload 和 onreadystatechange。然而,这些事件似乎只适用于文档本身,而不适用于单个元素。
非常感谢。
最佳答案
DOM 更改被推迟到 javascript 线程退出,因此这不起作用:
someNode.addChild(someElem);
w = someElem.clientWidth // 0
您必须启动一个新线程才能使用新添加的元素:
someNode.addChild(someElem);
setTimeout(function() {
w = someElem.clientWidth // should work
}, 0)
或者(更好),尝试监听 DOM 突变事件:
document.body.addEventListener('DOMNodeInserted', function(e) {
alert('div height=' + e.target.clientHeight)
})
d = document.createElement("div")
d.appendChild(document.createTextNode("hello"))
t = document.body.appendChild(d)
关于javascript - 如何知道 Html 元素何时准备好(呈现)?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23733480/