1 .用来监视DOM的变动,dom的任何变动,节点的增减,属性的变动,文本内容的变动,都可以观察到
2 .特点:
1 .采用异步的方法,等待所有脚本任务完成之后,才会执行操作
2 .把所有dom记录合并为一个数组进行操做,而不是一条条的处理个别DOM变动
3 .既可以观察发生在DOM节点的所有变动,也可以仅仅观察某一类变动
3 .用途
1 .通知web应用程序访问者,他们的当前页面发生了一些变化
2 .需要根据dom的变动加载一些js模块
3 .界面编辑器,当想要实现撤销,重做等功能的时候,利用这个api,可以知道上一部到底做了什么.
4 .用法
// 注册监听函数,定义监听发生之后发生的函数
const watch=new MutationObserver((m)=>{
m.forEach((e)=>{
console.log(e)
})
})
//监听DOM
watch.observe(document.documentElement,{
attributes:true,
characterData:true,
childList:true,
subtree:true,
attributeOldValue:true,
characterDataOldValue:true,
// 配置所要观察的变化类型
})
watch.desconnect()
//停止观察
watch.takeRecords()
//返回清除变动记录,不在处理未处理的变动