我做了这个小提琴,在更改div的innerHTML时,会侦听一些不同的MutationEvents,特别是DOMCharacterDataModified,DOMSubtreeModified和DOMNodeInserted。
http://jsfiddle.net/newtang/kysTm/15/
有趣的是,Chrome显示: DOMCharacterDataModified,DOMSubtreeModified
,而Firefox 5显示:DOMNodeInserted
我真的不确定谁是对的。我发现了这个老Mozilla bug: https://bugzilla.mozilla.org/show_bug.cgi?id=368133和W3文档(http://www.w3.org/TR/DOM-Level-2-Events/events.html),但我没有发现任何特别有启发性的内容。
有谁知道正确的行为是什么?我喜欢向某人提交一个错误,所以它是一致的。
答案 0 :(得分:3)
WebKit有一个“优化”,如果你将innerHTML设置为不包含标记的东西,你设置它的节点的第一个子节点是Text节点,它们将直接修改textnode中的文本而不是做什么规范要求(删除所有子项并创建一个新的Text子项)。因此,突变事件的差异。
答案 1 :(得分:2)
Firefox的行为似乎是正确的。你设置innerHTML,所以不要更改现有textNode的characterData,你插入一个新的textNode并删除任何现有的内容。(你可能也会在你的例子中看到DOMNodeRemoved,你会发现它也会激活)
在真正修改textNode的数据时看到差异:http://jsfiddle.net/doktormolle/yQu8v/