I'm experimenting with adding DOM Mutation Events to Prototype. It is probably too much of an edge case for Prototype Core (and maybe just academic in general) so it's in plugin form.
The two main events are DOMSubtreeModified (dom:subtreemodified) and DOMAttrModified (dom:attrmodified). The DOMSubtreeModified event is meant to fire anytime attribute or content is modified or a node is inserted or removed. It is a generic event that is fired along side all the other Mutation Events. The DOMAttrModified event fires any time an attribute is added, removed, or modified. In Prototype that happens in Element#writeAttribute, Element#update, Element#addClassName, and Element#removeClassName.
The other two events I've addressed are DOMNodeInserted and DOMNodeRemoved. Those are pretty self explanatory.
I've pasted my first draft online. (view)
I've also come up with some related methods. Element.onLoad polls the DOM until an element with the given id is found or until the entire DOM is loaded. Element.onCreate hooks into the Element constructor and fires registered callbacks anytime an element is created. Element.onExists registers a callback with Element.onLoad and Element.onCreate to fire when an element with the given id is loaded or created.
That first draft is also online. (view)
Off the top of my head, here is one possible use: A script wants to be aware of attempts by other scripts and plugins to replace content at or below a certain node.
$('message').observe('dom:subtreemodified', function(event) {
event.element().addClassName('warning');
});
previous page