今天给大家介绍一个非常好用的DOMAPI——MutationObserver使用后台页面或者父DOM需要监听子节点变化进行统一回调。这个变化包括：具体属性名称的变化，比如class等属性的变化整个DOM树子节点的变化MutationObserver简介这是来自MDN的官方介绍。MutationObserver接口提供了监视对DOM树所做更改的能力。它旨在替代旧的MutationEvents功能，后者是DOM3事件规范的一部分。MutationObserver主要包括三个方法，可以结合下面的例子：disconnect()-阻止MutationObserver实例继续接收通知observe()-配置MutationObserver以匹配DOM变化中的给定选项MutationObserver的通知队列删除&example中所有挂起的通知实例通过MutationObserver()构造一个实例，下面是使用示例//选择需要观察变化的节点consttargetNode=document.getElementById('some-id');//观察者配置（需要观察哪些变化）constconfig={attributes:true,//开启监听属性childList:true,//开启子节点监听subtree:true//开启下面所有节点监听thechildnode};//whenobserving突变发生时执行的回调函数constcallback=function(mutationsList,observer){//使用IE11的传统'for循环'for(letmutationofmutationsList){if(mutation.type==='childList'){console.log('已添加或删除子节点。');}elseif(mutation.type==='attributes'){console.log(''+mutation.attributeName+'属性被修改。');}}};//创建观察者实例，并传入回调函数constobserver=newMutationObserver(callback);//开始观察目标节点，上面配置observer.observe(targetNode,config);//之后就可以停止观察observer.disconnect();引入了config的值。上面的config是一个MutationObserverInit字典，描述了MutationObserver的配置。我们有以下用于配置的可选属性（没有强制属性）。属性介绍attributeFilter需要具体属性名的Array来监听。如果不包含此属性，则对所有属性的更改将触发更改通知。没有默认值。attributeOldValue当监控节点属性变化时，将此属性设置为true将记录任何更改的属性的最后一个值。没有默认值。attributes设置为true以监视被监视元素的属性值更改。默认值为假。characterData设置为true以监视子节点树中指定目标节点或节点包含的字符数据的变化。没有默认值。characterDataOldValue设置为true，当被监控节点上的文本发生变化时，记录节点文本的前一个值。没有默认值。childList设置为true以监视目标节点（如果子树为true，则包含后代）添加或删除新的子节点。默认值为假。subtree设置为true，将监控范围扩展到目标节点的整个节点树中的所有节点。MutationObserverInit的其他值也会影响这棵子树下的所有节点，而不仅仅是目标节点。默认值为假。callback引入callback作为回调函数，每当指定的节点或子树和配置项发生Dom变化时调用。回调函数有两个参数：一个是描述所有触发的突变的MutationRecord对象数组，另一个是调用该函数的MutationObserver对象。参考文章：https://developer.mozilla.org...附API适配：
