更改div中的内容时调用函数？

Question

我有一个页面，左边有一个用户可以点击的链接列表，当点击它们时，右侧的div将根据链接通过Ajax加载正确的内容。
现在我想在每次改变右侧div的内容时触发一个功能。
在SO中搜索后，我了解到有Mutation Events，我使用DOMSubtreeModified事件：

right_div.addEventListener("DOMSubtreeModified", handler, false);  

但是，当我点击左侧的链接时，似乎会多次调用handler。我希望在加载新内容时只调用一次。我怎么能这样做？

Answer 1

DOMSubtreeModified 是“一般事件，用于通知文档的所有更改”。您可以为特定突变设置突变事件：

1. DOMAttrModified活动
2. DOMCharacterDataModified活动
3. DOMNodeInserted活动
4. DOMNodeInsertedIntoDocument活动
5. DOMNodeRemoved活动
6. DOMNodeRemovedFromDocument活动

有以下类型：

1. DOMElementNameChanged
2. DOMAttributeNameChanged

因此，如果要替换节点，可能会导致两个（或更多）突变事件 - 一个在删除节点时，另一个在更换时。还可以分派更多事件，例如修改字符数据。如果您仅在更改文本内容时收听事件，请尝试DOMCharacterDataModified事件：

  

用户代理必须发送此事件   在CharacterData.data或之后   ProcessingInstruction.data已经过了   修改过，但节点本身没有   已插入或删除。近端   此事件的事件目标必须是   CharacterData节点或   ProcessingInstruction节点。