利用MutationObserver对页面元素的改变进行监听

Posted 2020-07-16 BigPanda

‘use strict‘;
let MutationObserver = window.MutationObserver 
|| window.WebKitMutationObserver 
|| window.MozMutationObserver;
let observerMutationSupport = !!MutationObserver;
if(observerMutationSupport){
    let observer = new MutationObserver((mutations) => {
        mutations.forEach((item) => {
            console.log(item);
        });
    });
    const options = {
        "childList" : true,//子节点的变动
        "attributes" : true,//属性的变动
        "characterData" : true,//节点内容或节点文本的变动
        "subtree" : true,//所有后代节点的变动
        "attributeOldValue" : true,//表示观察attributes变动时，是否需要记录变动前的属性
        "characterDataOldValue" : true//表示观察characterData变动时，是否需要记录变动前的值
    };
    observer.observe(document,options);
}