javascript - DOM 元素添加到 DOM 树后是否立即可用？

Question

在将一大块 HTML 动态附加到文档后(示例使用 jQuery，但问题对所有 JavaScript 都有效)，我可以假设附加的元素之后立即可用吗？

$('#content').append('<p>Content</p><button id="newbutton">New</button><p>Some more content</p>');
var forExample = $('#newbutton').width(); // Element available?

在我的特殊情况下，创建单个元素是不可行的。此外，这早已过去了 document.ready 事件。

Answer 1

是的，它们立即可用。例如，jQuery 会返回正确的对象，您可以将元素绑定(bind)到它们上。

但由于它们不会在您的脚本运行时呈现，因此不会总是立即进行大小计算，因此如果您需要对象的尺寸，您可能必须这样做

setTimeout(function(){
    var forExample = $('#newbutton').width();
    // use size
}, 0); // 0 is enough to tell the engine to render before it executes the callback

请注意，如果您进行增量调试(脚本并非真正“运行”)，浏览器的行为会有所不同。