javascript - 事件告诉您一个元素已附加到文档中？

Question

html 元素的某些属性只有在 HTML DOM 中才能确定，例如 offsetHeight 或 offsetWidth。如果我 createElement('div') 并想使用 div 的 offsetHeight，当这个元素附加到文档时是否会触发一个事件，以便我知道我现在可以使用 offsetHeight？

Answer 1

DOMNodeInserted可能是您正在寻找的。有关 DOM 事件的详细信息，请参阅https://developer.mozilla.org/en/DOM/DOM_event_reference

Answer 2

某些浏览器会在您将其添加到 DOM 后立即初始化这些属性。它需要在 DOM 中，以便可以应用 CSS 规则。

因此，您不需要接收事件，只需在创建元素后立即将元素添加到 DOM 即可。

但是，如果您发现您需要的属性没有立即初始化，您可以将该代码分离到另一个函数中（就像您对事件处理程序所做的那样）并立即使用它来调用它setTimeout(otherFunction, 0)。一旦你的 JavaScript 完成执行，浏览器会相应地响应你的 DOM 更改，然后立即调用你的其他函数。这有点像举办活动，但自己触发。

Answer 3

不，我不认为有这样的活动。但是您可以将一个属性附加到新创建的元素，告诉您的脚本它已附加。您可以执行以下操作：

function appendSignal(el,toElement){
  to.appendChild(el);
  el.isAppended = true;
}

var nwdiv = document.createElement('div');
// do stuff with nwdiv
appendSignal(nwdiv,document.body);
//doing other stuff
if (nwdiv.isAppended) {
  /* nwdiv.offsetHeight should be available... */
}