I have been looking for a while for a solution to monitor DOM node insertion/removal, without success. For example events like DOMnodeInserted are not cross-browser and are being deprecated.
I recently watched tutorials about libraries that implement MVC or MVVM patterns, like Backbone or Knockout. As such libraries monitor DOM elements, I was wondering if they could be used to monitor DOM node insertion/removal.
For example:
- if I have a select element on the page, I’d like to trigger an action when a new option gets added.
- if I have a table element on the page, I’d like to trigger an action when a row is added or removed.
This isn’t what Knockout does, and I don’t think you’ll find success there.
You could do something like binding your select elements to a KO observableArray, then monitor that array for changes. But that doesn’t stop someone from manually inserting a select element into the DOM.
Bottom line: for KO, you’re barking up the wrong tree.