setMutationHandler

MutationObserver wrapper to wait for the specified CSS selector

Fra og med 13.02.2017. Se den nyeste version.

Dette script bør ikke installeres direkte. Det er et bibliotek, som andre scripts kan inkludere med metadirektivet // @require https://update.greatest.deepsurf.us/scripts/12228/174877/setMutationHandler.js

Skaber
woxxom
Version
3.0.1
Oprettet
05.09.2015
Opdateret
13.02.2017
Size
4,04 kB
Licens
N/A

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://greatest.deepsurf.us/scripts/12228/code/setMutationHandler.js
..............
// ==/UserScript==
  • Watch for added nodes:

    setMutationHandler(document, '.container p.some-child', nodes => {
        nodes.forEach(node => node.style.display = 'none');
        return false; // disconnect the observer, this is useful for one-time jobs
    });
    
  • The observation target parameter may be omitted so "document" will be used by default:

    setMutationHandler('.container p.some-selector', nodes => { ...... });
    
  • Options form:

    setMutationHandler({
        processExisting: true, // Process existing elements and watch for mutations from now on
        selector: '.container p.some-child',
        handler: nodes => nodes.forEach(node => node.style.display = 'none')
    });
    
  • Watch for added nodes only inside the specified container element that already exists in the document:

    setMutationHandler({
        target: document.querySelector('.container-selector'),
        selector: 'p.some-child',
        handler: nodes => nodes.forEach(node => node.style.display = 'none')
    });
    
  • Advanced example with customized mutation options:

    setMutationHandler({
        selector: '.container p.some-child',
        processExisting: false,       // optional
        target: document,             // optional
        childList: true,              // optional
        subtree: true,                // optional
        attributes: false,            // optional
        attributeFilter: [],          // optional
        attributeOldValue: false,     // optional
        characterData: false,         // optional
        characterDataOldValue: false, // optional
        handler: nodes => {
            console.log(nodes);
            return false; // disconnect the observer, this is useful for one-time jobs
        },
    });
    
  • Make your userscript run at document-start to catch the mutations during page load:

    ..............
    // @run-at        document-start
    // @require       https://greatest.deepsurf.us/scripts/12228/code/setMutationHandler.js
    ..............
    // ==/UserScript==