javascript - jQuery:如何监听 DOM 变化？

Question

是否可能以及如何使用 jQuery 监听整个 DOM 树的变化？

我的具体问题:我有一个“工具提示”功能，当您在任何 html 元素上执行 hover 时，它以时尚的方式显示 title 属性的内容。但是，当您进行悬停时，浏览器会按照标准在其自己的框中呈现 title。我想压制它。所以我想到的是在第一次加载页面时将 title 属性的内容移动到自定义(HTML5)data-title 属性，然后我的工具提示功能将与 data-title 一起使用。

问题是稍后我可能会动态添加/删除/更改 HTML，因此我需要“重新绑定(bind)”那些元素 - 再次更改那些标题属性。如果有一个事件监听器可以为我监听此类更改并自动重新绑定(bind)元素，那就太好了。

Answer 1

我的最佳猜测是您想监听 DOM 突变事件。您可以通过 DOM 突变事件来实现这一点，就像任何普通的 javascript 事件(例如鼠标单击)一样。

引用这个:W3 MutationEvent

例子:

$("element-root").bind("DOMSubtreeModified", "CustomHandler");