我需要一种有效的机制来检测 DOM 的变化。最好是跨浏览器，但如果有任何不跨浏览器的有效方法，我可以使用故障安全的跨浏览器方法来实现它们。
特别是，我需要检测会影响页面文本的更改，因此需要任何新的、删除的或修改的元素，或者对内部文本 (innerHTML) 的更改。
我无法控制所做的更改(它们可能是由于包含第 3 方 javascript 等)，因此无法从这个 Angular 进行处理 - 我需要以某种方式“监视”更改。
目前我已经实现了一种“quick'n'dirty”方法，它会定期检查 body.innerHTML.length。这当然不会检测到导致返回相同长度的变化，但在这种情况下“足够好” - 发生这种情况的可能性非常小，并且在这个项目中，未能检测到变化不会导致丢失数据。
body.innerHTML.length 的问题在于它很昂贵。在快速 浏览器上，它可能需要 1 到 5 毫秒，这会使事情陷入困境 - 我还要处理大量的 iframe，而且所有这些都会加起来。我很确定这样做的代价高昂是因为 innerHTML 文本不是由浏览器静态存储的，每次读取时都需要从 DOM 中计算出来。
我正在寻找的答案类型是从“精确”(例如事件)到“足够好”的任何东西 - 可能像 innerHTML.length 方法一样“quick'n'dirty”，但执行更快。
编辑: 我还应该指出，虽然检测到被修改的精确元素会“很好”，但这不是绝对必要的 - 只要有 任何 变化就足够了.希望这能扩大人们的 react 范围。我将调查 Mutation Events，但我仍然需要 IE 支持的回退，因此非常欢迎任何古怪的、有创意的、超出常规的想法。
最佳答案
为了使其与时俱进，DOM4 标准取消了 Mutation Events 并将其替换为 Mutation Observers:https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver
关于javascript - 检测/监控 DOM 变化的最有效方法？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/2457043/