老的 DOM mutation events（如 DOMNodeInserted）每次变化都同步触发，严重拖慢渲染，已被标准废弃。MutationObserver 是异步的：把多次变化收集起来，在微任务阶段一次性回调，还允许配置只观察子节点列表、属性或文本内容，精细控制监听范围。
调用方式：new MutationObserver(回调) 创建观察者，传入目标节点与配置对象（childList / attributes / subtree / characterData 等），变化会在回调的 mutations 数组里逐条给出 type 与目标节点，disconnect() 停止观察。适合第三方脚本监听框架渲染、实现撤销栈、做无限滚动的兜底检测。
var box = document.createElement('div'); document.body.appendChild(box); var ob = new MutationObserver(function (mutations) { mutations.forEach(function (m) { console.log('变化类型:', m.type); m.addedNodes.forEach(function (n) { console.log('新增节点:', n); }); m.removedNodes.forEach(function (n) { console.log('删除节点:', n); }); }); }); ob.observe(box, { childList: true, subtree: true, attributes: true }); // 模拟框架渲染 box.innerHTML = '<p>动态插入的内容</p>'; setTimeout(function () { ob.disconnect(); }, 2000);