MutationObserver wrapper to wait for the specified CSS selector
As of
This script should not be not be installed directly. It is a library for other scripts to include with the meta directive // @require https://update.greasyfork.org/scripts/12228/135916/setMutationHandler.js
A MutationObserver wrapper to wait for an element (or elements) with the specified CSS selector.
First, load the function in your script metablock:
.............. // @require https://greasyfork.org/scripts/12228/code/setMutationHandler.js .............. // ==/UserScript==
Watch for added nodes:
setMutationHandler(document, '.container p.some-selector', function(nodes) {
nodes.forEach(function(node) {
node.style.display = 'none';
});
//this.disconnect(); // stop observing
return true; // continue enumerating current batch of mutations
});
Watch for added nodes only inside the specified container element that already exists in the document:
setMutationHandler(document.querySelector('.container-selector'), '.some-selector', function(nodes) {
nodes.forEach(function(node) {
node.style.display = 'none';
});
//this.disconnect(); // stop observing
return true; // continue enumerating current batch of mutations
});
Advanced example with customized options to watch for changes in the title attribute:
setMutationHandler(document, '.some-selector', processNodes, {
attributes: true, attributeFilter: ['title'],
subtree: true
});
function processNodes(nodes, mutation) {
console.log('Node %O changed title from "%s" to "%s"',
nodes[0], mutation.oldValue, nodes[0].title);
});
//this.disconnect(); // stop observing
return true; // continue enumerating current batch of mutations
});
You may want to make your userscript run at document-start to catch the mutations during page load:
.............. // @run-at document-start // @require https://greasyfork.org/scripts/12228/code/setMutationHandler.js .............. // ==/UserScript==