不能监听 document.body 或全页，必须锁定业务关键容器、严格配置观察项、回调中轻量判定、修复前断开观察器，否则会漏报或卡死主线程；因第三方插件高频变更（如轮播、埋点、iframe）导致噪音淹没真实恶意操作，甚至引发“观察器 DoS”。

直接结论：不能监听 document.body 或全页，必须锁定业务关键容器 + 严格配置观察项 + 回调中轻量判定 + 修复前断开观察器，否则不是漏报就是卡死主线程。

为什么不能用 document.body 直接监听整个页面

第三方插件（如客服 SDK、广告组件、A/B 测试脚本）每秒可能触发数十次 DOM 变更，包括轮播图 class 切换、埋点 script 插入、统计 iframe 挂载。监听 document.body 会把所有这些正常行为都捕获进来，导致：

• 回调被高频触发，MutationObserver 回调本身是微任务，但里面做 DOM 遍历或正则匹配极易阻塞主线程
• 真正危险的操作（比如删掉 #pay-button、往 .legal-notice 里塞广告 iframe）被淹没在噪音里
• 某些插件会故意触发大量无意义变更来干扰你的监控逻辑，形成“观察器 DoS”

应该监听哪些节点和哪些变更类型

只盯住你真正不能被改的区域，例如：#login-form、.price-display、[data-role="terms-content"]。观察配置必须满足三个条件：

• childList: true —— 必开，用于捕获插入广告 div、删除关键按钮等操作
• subtree: true —— 必开，否则插件在 #pay-button > span > button 里动刀你就完全不知道
• attributes: true + 手动过滤 class、style、hidden、data-* —— 不要用 attributeFilter，它不支持通配符，data-* 写不进去；改用回调里用 mutation.attributeName.startsWith('data-') 判断
• characterData: true —— 仅对法律声明、版权信息等文本敏感区开启；普通业务区域可关，避免额外开销
• attributeOldValue: false、characterDataOldValue: false —— 不需要比对旧值，发现就处理，省去内存和计算

回调里怎么快速识别恶意操作而不是误伤

不要一看到 addedNodes 就删，先过几道轻量过滤：

• 用 noticeEl.contains(mutation.target) 确认变更发生在目标容器内或其后代，否则直接 return
• 若 mutation.type === 'childList'，遍历 mutation.addedNodes，检查是否含：node.matches('script[src*="malicious"]')、node.matches('[id^="ad-"], [class*="taboola"], iframe[src]')
• 若 mutation.type === 'attributes' 且 mutation.attributeName === 'style'，检查 mutation.target.style.display === 'none' 或 visibility === 'hidden'
• 若 mutation.type === 'childList' 且 mutation.removedNodes.length > 0，查是否删掉了已知关键子节点，例如：noticeEl.querySelector('#real-terms-text') 是否还在

修复时为什么必须调用 observer.disconnect()

这是最容易被跳过的致命细节。你在回调里执行 el.remove() 或 node.replaceWith(original)，这些操作本身又会触发新的 mutation 记录，导致无限递归调用回调 —— 不是报错，而是静默卡死 UI。

正确顺序只能是：

• 检测到恶意节点 → observer.disconnect()
• 执行修复（如 badNode.remove() 或 container.innerHTML = originalHTML）
• 修复完成 → observer.observe(target, config) 重新监听

注意：不要在回调里用 setTimeout 延迟重连，插件可能在你延迟期间继续篡改；断开、修复、重连这三步必须同步完成。另外，首次初始化前建议用 target.cloneNode(true) 缓存原始结构，比字符串快照更可靠，也避免被插件污染 innerHTML。