javascript - 在添加到 DOM 时触发 Javascript 事件

Question

有谁知道在将元素添加到 DOM 后如何触发 Javascript 中的事件？

一般的想法是这样的：

var elem = document.createElement('div');
elem.addEventListener('ON_ADD_TO_BODY', function(){console.log(elem.parentNode)});
//... LATER ON ...
parentElemInBody.appendChild(elem); // <- Event is triggered here after append

在将元素添加到 DOM 之前，有些函数不应该被触发，因此延迟执行直到元素被添加是有意义的。

有没有办法做到这一点而无需稍后明确调用它们，或者我应该做一些包括 asetTimeout和检查以查看元素是否已添加到 DOM 的 hack？

Answer 1

使用DOMNodeInserted突变事件。

此处的文档：https ://developer.mozilla.org/en-US/docs/DOM/Mutation_events

上页给出的示例用法：

element.addEventListener("DOMNodeInserted", function (ev) {
  // ...
}, false);

注：2016 年 4 月 17 日

突变事件目前已被弃用。现在推荐的方法是 Mutation Observers。