是否有任何javascript监听器将元素添加到DOM中的另一个元素中？

Question

我认为一切都在标题中。

有没有办法在追加任何其他元素时触发的dom元素中添加一个侦听器。

jQuery("#rootElement").bind("addElementEvent", function() {
    console.log("Element was added");
});

<div id="rootElement"></div>

当那样的时候：

jQuery("#rootElement").append("<div >another element</div>");

触发：

Element was added

我不知道我是否真的很清楚......

Answer 1

有一个名为livequery()的插件可以完全满足您的需求......示例用法：

$('#idofelement').livequery(function() {
   // perform selector on $(this) to apply class   
});

使用此方法会在添加了标识为idofelement的DOM元素时执行该功能

Answer 2

它被称为“突变事件”。这些事件在所有现代浏览器中都可用，但不过现在它们被标记为过时了。

例如

jQuery("#rootElement").bind("DOMNodeInserted", function( e ) {
    console.log("Element was added");
});

jsFiddle演示：http://jsfiddle.net/P6wdH/

参考：MDN DOM reference

正如我已经提到的，这适用于几乎所有现代浏览器。但它仍然存在使用它们的某种风险。由于在任何规范中都没有其他选择，我认为这些事件不会很快消失，但你应该知道当前的状态。

Answer 3

根据http://help.dottoro.com/ljmcxjla.php，主要浏览器支持名为DOMNodeInserted的事件。但我不知道IE的旧版本