MutationObserver网页元素变更监视

MutationObserver接口提供了监视对DOM树所做更改的能力。它被设计为旧的Mutation Events功能的替代品，该功能是DOM3 Events规范的一部分。

构造函数：MutationObserver()

方法：

• disconnect()：解除监视
• observe()：监视某个dom元素的变更
• takeRecords()：从MutationObserver的通知队列中删除所有待处理的通知

代码：

let MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver;
let observer = new MutationObserver(function(mutations) {
    // console.log(mutations)
    mutations.forEach(function(record) {
        if(record.attributeName === "value" ){
            console.log(record.target.getAttribute("id"))
            console.log(record.oldValue)
            console.log(record.target.value)
        }
    });
});
let observerOptions = { attributes: true, childList: true, characterData: true, attributeOldValue :true, attributeFilter:["value"] }
observer.observe(document.getElementById("xxxxx"), observerOptions);

observerOptions中可以配置监听的变更内容。