javascript - 动态创建的DOM节点插入时的处理程序

我喜欢在我不拥有或控制的页面上运行自定义脚本。这些页面很多时候都动态创建了我想对其应用功能的内容。

这可能吗？如果是这样，我该怎么做？理想情况下，我正在寻找一些实时jQuery的live方法，除了绑定(bind)诸如click之类的事件外，它更像是将元素加载到DOM中时发生的事件。 load事件适用于某些元素，但我不认为所有...

对于此问题，假定您无法查看或更改插入DOM节点的代码。我想要一种可以在多个不相关站点中使用的用户脚本或小书签中使用的技术。

编辑:我正在寻找在我的反色书签上使用的东西:JavaScript: Invert color on all elements of a page

最佳答案

假设您正在运行Firefox或Chrome之类的浏览器，则可以监听DOMNodeInserted事件:

$(document).on('DOMNodeInserted', function(e) {
    $(e.target).css({ color : '#c00' });
});

$('body').append('<div>test</div>');

fiddle :http://jsfiddle.net/VeF6g/(可能在IE中失败)

更新:
该事件已弃用。您应该使用MutationObserver:

var observer = new MutationObserver(function(mutationList) {
    for (var mutation of mutationList) {
        for (var child of mutation.addedNodes) {
            child.style.color = '#c00';
        }
    }
});
observer.observe(document, {childList: true, subtree: true});

// ready? Then stop listening with
observer.disconnect();