我需要一种高效的机制来检测DOM的变化。最好是跨浏览器的,但如果有任何高效的方法不跨浏览器,我可以用可靠的跨浏览器方法来实现。
特别是,我需要检测可能影响页面文本的变化,因此必须包括任何新元素、被删除的元素或修改了内部文本(innerHTML)的元素。
我无法控制所做的更改(它们可能是由第三方javascript包括等引起的),因此无法从这个角度进行处理——我需要以某种方式“监视”变化。
目前我已经实施了一个“快速而简单”的方法,定期检查body.innerHTML.length
。当然,这不会检测到导致返回相同长度的更改,但在这种情况下是“足够好的”——出现这种情况的可能性非常小,在这个项目中,未能检测到更改不会导致数据丢失。
body.innerHTML.length
的问题在于它很耗费资源。在一个快速的浏览器上,它可能需要1到5毫秒,这可能会使事情变得非常缓慢——我还要处理大量的iframe,这会增加一些负担。我相当确定这样做昂贵是因为innerHTML文本不是被浏览器静态存储的,每次读取时都需要从DOM中计算出来。
我正在寻找的答案类型包括从“精确”(例如事件)到“足够好”的任何东西——也许像innerHTML.length方法那样“快速而简单”,但执行速度更快。
编辑:我还应该指出,虽然检测到已修改的精确元素会很“好”,但并不是绝对必要的——只要有任何变化就足够了。希望这能扩大人们的回答范围。我将调查Mutation Events,但我仍然需要一个IE支持的备用方案,因此任何奇怪、创造性、超出传统想法的建议将非常受欢迎。