用jQuery检测元素内容的变化
change()函数的工作原理和检测表单元素的变化，但有没有一种方法来检测DOM元素的内容何时被改变？
这不起作用，除非＃内容是表单元素
$("#content").change( function(){ // do something });
我想要这样做时触发，如：
$("#content").html('something');
另外html()或append()函数没有callback。
有什么build议么？
这些是突变事件 。
我没有在jQuery中使用突变事件API，但粗略的search导致我在GitHub上的这个项目 。 我不了解项目的成熟。
我知道这个post已经有一年了，但是我想为那些有类似问题的人提供一个不同的解决scheme：
-
jQuery更改事件只用于用户input字段，因为如果有其他操作（例如，div），则该操作来自代码。 所以，find操纵发生的地方，然后将所需的任何东西添加到那里。
-
但是，如果这是不可能的，因为任何原因（你正在使用一个复杂的插件或无法find任何“callback”的可能性），那么我build议的jQuery方法是：
一个。 对于简单的DOM操作，使用jQuery链接和遍历，
$("#content").html('something').end().find(whatever)....湾 如果您想要做其他事情，请使用jQuery
bind自定义事件和triggerHandler$("#content").html('something').triggerHandler('customAction'); $('#content').unbind().bind('customAction', function(event, data) { //Custom-action });
这是一个jQuery触发器处理程序的链接： http : //api.jquery.com/triggerHandler/
$(document).bind("DOMSubtreeModified",function(){ console.log($('body').width() + ' x '+$('body').height()); })
此事件已被弃用，以支持Mutation Observer API
浏览器不会触发<div>元素的onchange事件。
我认为这背后的原因是这些元素不会改变，除非被javascript修改。 如果您已经不得不自己修改元素（而不是用户这样做），那么您可以在修改元素的同时调用相应的附加代码，如下所示：
$("#content").html('something').each(function() { });
你也可以手动启动这样的事件：
$("#content").html('something').change();
如果这些解决scheme都不适合你的情况，你能否提供更多的信息来说明你正在做什么？
尝试绑定到DOMSubtreeModified事件seeign，因为testing也只是DOM的一部分。
在这里看到这个职位：
如何-DO-显示器最DOM换的变化
试试这个，它是由James Padolsey（JP这里的SO）创build的，并且正是你想要的（我想）
http://james.padolsey.com/javascript/monitoring-dom-properties/
而对于HTML5，我们拥有原生的DOM突变观察者 。
这不是一个严格的jQuery的答案 – 但有用的提及debugging。
在Firebug中，您可以右键单击DOM树中的元素并设置“断开属性更改”：
在脚本中更改属性时，将显示debugging窗口，您可以跟踪它发生了什么。 在下面还有一个元素插入和元素移除的选项（无法被screengrab中的popup窗口遮住）。
试试livequery插件。 这似乎对我正在做的类似的工作。
我正在开发一个名为mutabor的小型JS库（ https://github.com/eskat0n/mutabor ），旨在简化DOM突变事件的使用。 有关示例，请参阅demo.html。
通常一个简单而有效的方法来实现这个目标，就是跟踪你修改DOM的时间和地点。
您可以通过创build一个始终负责修改DOM的中心函数来完成此操作。 然后你可以在这个函数内部修改你所需要的元素。
在最近的一个应用程序中，我不需要立即采取行动，所以我使用了一个简单的load（）函数的callback函数，将一个类添加到任何修改的元素，然后每隔几秒用setInterval计时器更新所有修改的元素。
$($location).load("my URL", "", $location.addClass("dommodified"));
那么你可以处理它，但是你想 – 例如
setInterval("handlemodifiedstuff();", 3000); function handlemodifiedstuff() { $(".dommodified").each(function(){/* Do stuff with $(this) */}); }
您可以添加一个callback选项到HTML（或任何）函数：
$.fn.oldHtml = $.fn.html; $.fn.html = function(html,fn){ fn = fn || function(){}; var result = this.oldHtml(html); fn(); return result; }; $('body').html(11,function(){alert("haha");});
在这里演示。
你在一些元素上做了改变，而不是元素被你必须捕捉的东西强制改变。
我写了一个片段，将检查一个事件的元素的变化。
所以，如果你使用的是第三方的JavaScript代码或什么东西，你需要知道什么时候出现或改变，当你点击，那么你可以。
对于下面的代码片断，可以说你需要知道点击一个button后表格内容的变化。
$('.button').live('click', function() { var tableHtml = $('#table > tbody').html(); var timeout = window.setInterval(function(){ if (tableHtml != $('#table > tbody'). console.log('no change'); } else { console.log('table changed!'); clearInterval(timeout); } }, 10); });
伪代码：
- 一旦你点击一个button
- 捕获您期望更改的元素的html
- 然后我们不断检查元素的html
- 当我们发现html不同时，我们停止检查
我们可以通过使用突变事件来实现这一点。 根据www.w3.org，突变事件模块旨在允许通知文档结构的任何变化，包括attr和文本修改。 欲了解更多细节突变事件
例如 ：
$("body").on('DOMSubtreeModified', "#content", function() { alert('Content Modified'); // do something });
不可能，我相信ie有一个内容改变的事件，但它肯定不是X浏览器
我应该说，没有一些讨厌的间隔在背后徘徊！
