Is there any event in Internet Explorer, that is fired whenever DOM is changed? For example:
document.attachEvent("ondocumentchange", function () {
alert("you've just changed DOM!");
});
And when I execute:
document.appendChild(document.createElement("img"));
Window with text "you've just changed DOM!" appears.
I try to emulate "advanced" CSS selectors (e.g. +, >, [attr]) in IE6 using Javascript. However to work properly with dynamic content, they would have to be recalculated after each change in document.
Brute-force "solution":
(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)();
You want to look at dom mutation events - see http://en.wikipedia.org/wiki/DOM_Events, and scroll down to the section on mutation events. Only problem is that support for these events is pretty sketchy, so be careful using them. Notably, a lack of support at all in IE or Opera. Firefox, Safari and Chrome seem to be the only ones.
Something like:
document.addEventListener("DOMSubtreeModified", function () {
alert("you've just changed DOM!");
});
According to http://www.quirksmode.org/dom/events/index.html for these kind of events you need to use addEventListener, not attachEvent. The event apparently bubbles, so that should be fine.
Off the top of my head, this might work:
document.body.attachEvent('onpropertychange', function(event) {
if (event.propertyName !== 'innerHTML') return;
alert("you've just changed DOM!");
});
This relies on IE's proprietary [onPropertyChange event](http://msdn.microsoft.com/en-us/library/ms536956(VS.85).aspx) — since the document's innerHTML
would change whenever a node is inserted. But:
It might not work with certain types of properties. I imagine innerHTML
would function like a "getter" in that it'd only get recalculated when retrieved.
It would also pick up a lot of false positives — lots of other things would modify the innerHTML
that would have nothing to do with node insertion. You could mitigate this by listening on a particular element, rather than document-wide.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With