Question

Internet Explorer中是否有任何事件，只要DOM被更改就会被触发？例如：

document.attachEvent("ondocumentchange", function () {
    alert("you've just changed DOM!");
});

当我执行时：

document.appendChild(document.createElement("img"));

带有文字的窗口“你刚刚改变了DOM！”出现。

我尝试使用Javascript在IE6中模拟“高级”CSS选择器（例如+，＆gt;，[attr]）。但是，要在动态内容中正常使用，必须在每次更改文档后重新计算它们。

Answer 1

蛮力“解决方案”：

(function (previousInnerHTML) {
    return function () {
        if (document.body.innerHTML !== previousInnerHTML) {
            alert("you've just (at max 33ms ago) changed DOM");
        }
        setTimout(arguments.callee, 33);
    };
})(document.body.innerHTML)();

Answer 2

您想查看dom变异事件 - 请参阅http://en.wikipedia.org/wiki/DOM_Events，然后向下滚动到有关变异事件的部分。唯一的问题是对这些事件的支持是相当粗略的，所以要小心使用它们。值得注意的是，在IE或Opera中缺乏支持。 Firefox，Safari和Chrome似乎是唯一的。

类似的东西：

document.addEventListener("DOMSubtreeModified", function () {
    alert("you've just changed DOM!");
});

根据http://www.quirksmode.org/dom/events/index.html对于这类事件，您需要使用addEventListener，而不是attachEvent。事件显然是泡沫，所以应该没事。

Answer 3

在我的头顶，这个可能工作：

document.body.attachEvent('onpropertychange', function(event) {
  if (event.propertyName !== 'innerHTML') return;
  alert("you've just changed DOM!");
});

这取决于IE的专有[onPropertyChange事件]（http://msdn.microsoft.com/en-us/library/ms536956(VS.85).aspx) - 因为文档的innerHTML会在插入节点时发生变化。但是：

它可能不适用于某些类型的属性。我想innerHTML的作用就像“吸气剂”一样，它只会在检索时重新计算。
它还会拾取很多的误报 - 许多其他内容会修改与节点插入无关的innerHTML。您可以通过侦听特定元素而不是文档范围来缓解这种情况。

是否有任何onDocumentChange事件？

3 个答案: