setMutationHandler

MutationObserver wrapper to wait for the specified CSS selector

此腳本不應該直接安裝,它是一個供其他腳本使用的函式庫。欲使用本函式庫,請在腳本 metadata 寫上: // @require https://update.greasyfork.org/scripts/12228/175122/setMutationHandler.js

您需要先安裝使用者腳本管理器擴展,如 TampermonkeyGreasemonkeyViolentmonkey 之後才能安裝該腳本。

You will need to install an extension such as Tampermonkey to install this script.

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyUserscripts 後才能安裝該腳本。

你需要先安裝一款使用者腳本管理器擴展,比如 Tampermonkey,才能安裝此腳本

您需要先安裝使用者腳本管理器擴充功能後才能安裝該腳本。

(我已經安裝了使用者腳本管理器,讓我安裝!)

Advertisement:

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

(我已經安裝了使用者樣式管理器,讓我安裝!)

Advertisement:

作者
woxxom
版本
3.0.2
建立日期
2015-09-05
更新日期
2017-02-14
尺寸
3.1 KB
授權條款
未知

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-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://greasyfork.org/scripts/12228/code/setMutationHandler.js
    ..............
    // ==/UserScript==