您可以使用
DOMNodeInserted和
DOMNodeRemoved检查是否添加或删除了元素。不幸的是,IE不支持此功能。
$('#myDiv').bind('DOMNodeInserted DOMNodeRemoved', function(event) { if (event.type == 'DOMNodeInserted') { alert('Content added! Current content:' + 'nn' + this.innerHTML); } else { alert('Content removed! Current content:' + 'nn' + this.innerHTML); }});更新资料
您可以使用保存初始内容和将来的更改
.data()。这是一个例子。
var div_eTypes = [], div_changes = [];$(function() { $('#myDiv').each(function() { this['data-initialContents'] = this.innerHTML; }).bind('DOMNodeInserted DOMNodeRemoved', function(event) { div_eTypes.concat(e.type.match(/insert|remove/)); div_changes.concat(this.innerHTML); });});输出示例:
> $('#myDiv').data('initialContents');"<h1>Hello, world!</h1><p>This is an example.</p>"> div_eTypes;["insert", "insert", "remove"]> div_changes;["<iframe src='http://example.com'></iframe>", "<h4>IANA — Example domains</h4><iframe src='http://example.com'></iframe>", "<h4>IANA – Example domains</h4>"]更新2
您可能还想包括
DOMSubtreeModified它,因为我发现了这一点,
DOMNodeInserted并且
DOMNodeRemoved如果
innerHTML直接替换一个元素也不会触发。它仍然不能在IE中运行,但至少在其他浏览器中可以正常运行。



