告诉您元素已追加到文档的事件

Event to tell you that an element has been appended to the document?

本文关键字：文档 事件 追加 元素      更新时间：2023-09-26
html

元素的某些属性在HTML DOM中之前无法弄清楚，例如offsetHeight或offsetWidth。 如果我创建元素（'div'）并想使用div 的 offsetHeight，那么当将此元素附加到文档时，是否有一个事件会触发，以便我知道我现在可以使用 offsetHeight？

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

不，我认为没有事件。但是，您可以将属性附加到新创建的元素，告诉脚本已追加该属性。您可以执行以下操作：

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... */
}

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

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

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

相关文章：