MutationObserver
Wrapper that makes MutationObserver more easy to use.
usage
Include the script in the page
<script type="module" src="/node_modules/@vdegenne/mutation-observer/mutation-observer.js"></script>then on one of your element
const elementToWatch = document.getElementById('myElement')
const observer = MutationObserver.observe(elementToWatch, (mutations, element) => {
console.log(`myElement changed`)
})disconnecting
observer.disconnect()subtree
By default the observer only watches the children of the element.
To watch the subtree pass true to the 3rd argument :
MutationObserver.observe(
elementToWatch,
(mut, el) => { /* callback */ },
true
)child_list & character_data
By default the observer only responds when nodes are added or removed.
If you want to watch for textual changes only provide the type as the 2nd argument :
/* character data */
MutationObserver.observe(elementToWatch, MutationObserver.CHARACTER_DATA, callback)
// same as
MutationObserver.observe(elementToWatch, 'character_data', callback)
// same as
MutationObserver.observe(elementToWatch, 2, callback)
/* child list (default) */
MutationObserver.observe(elementToWatch, MutationObserver.CHILD_LIST, callback)
// same as
MutationObserver.observe(elementToWatch, 'child_list', callback)
// same as
MutationObserver.observe(elementToWatch, 1, callback)
// same as
MutationObserver.observe(elementToWatch, callback) // defaultInstallation
npm i @vdegenne/mutation-observer