检测/监测DOM变化的最有效方法？
我需要一个有效的机制来检测DOM的变化。 最好是跨浏览器，但如果有任何不是跨浏览器的有效手段，我可以实现这些与一个故障安全跨浏览器方法。
特别是，我需要检测会影响页面文本的更改，因此需要任何新的，删除或修改的元素，或者更改内部文本（innerHTML）。
我无法控制所做的更改（可能是由于第三方JavaScript包含等），所以无法从这个angular度来处理 – 我需要以某种方式“监视”更改。
目前我已经实现了一个“quick'n'dirty”方法， body.innerHTML.length隔一段时间检查body.innerHTML.length 。 这当然不会检测到导致返回相同长度的变化，但是在这种情况下“足够好” – 发生这种情况的可能性非常小，在这个项目中，不能检测到变化在丢失的数据。
body.innerHTML.length的问题是它很昂贵。 在一个快速的浏览器上，它可能需要1到5毫秒，这可能会让事情变得非常糟糕 – 我也在处理大量的iframe，这些都会加起来。 我很确定这样做的代价很大，因为innerHTML文本不是由浏览器静态存储的，每次读取时都需要从DOM中计算出来。
我正在寻找的答案的types是从“精确的”（例如事件）到“足够好”的任何东西 – 可能是innerHTML.length方法的“quick'n'dirty”，但执行速度更快。
编辑：我也应该指出，尽pipe检测已被修改的精确元素是“好的”，但这不是绝对必要的 – 只是事实上已经有任何改变就足够了。 希望这能扩大人们的反应。 我要去调查突变事件，但是我仍然需要IE支持的回退，所以任何有创意的，不寻常的想法都是非常受欢迎的。
http://www.quirksmode.org/js/events/DOMtree.html
jQuery现在支持一种将事件附加到与select器对应的现有和未来元素的方法： http : //docs.jquery.com/Events/live#typefn
另一个有趣的发现 – http://james.padolsey.com/javascript/monitoring-dom-properties/
为了使这个更新，DOM4标准消除了突变事件，并用突变观察者代替了它们： https ： //developer.mozilla.org/en-US/docs/Web/API/MutationObserver
突变事件是你正在寻找的W3build议。
不知道他们是否全力支持..（IE很可能不会支持他们..）
你可以尝试使用DOMNodeInserted和DOMNodeRemoved事件。 根据Quirksmode，他们在大多数浏览器中工作，除IE之外明显的例外…
我最近写了一个插件，完全是 – jquery.initialize
您可以像使用.each函数一样使用它
$(".some-element").initialize( function(){ $(this).css("color", "blue"); });
与.each的不同之处在于 – 它需要你的select器，在这种情况下.some-element并在将来等待这个select器的新元素，如果这个元素将被添加，它也将被初始化。
在我们的例子中，初始化函数只是将元素的颜色改为蓝色。 所以如果我们要添加新的元素（不pipe是用ajax还是F12检查器或者其他的东西），比如：
$("<div/>").addClass('some-element').appendTo("body"); //new element will have blue color!
插件将立即启动它。 插件也确保一个元素只被初始化一次。 所以，如果你添加元素，然后从身体.deatch() ，然后再添加它，它不会被再次初始化。
$("<div/>").addClass('some-element').appendTo("body").detach() .appendTo(".some-container"); //initialized only once
插件是基于MutationObserver – 它可以在IE9和10上工作，具有依赖性，详见自述文件页面 。
jQuery Mutate也是这样做的，默认情况下它支持像height, width, scrollHeight等等，但是它也可以扩展一些额外的代码来添加新的事件，比如看看文本是否改变等。
http://www.jqui.net/jquery-projects/jquery-mutate-official/
希望它有帮助
