树镜像js和变异摘要是否支持iframe?

时间:2017-03-12 17:37:00

标签: javascript dom iframe mutation-observers mutation-events

我一直在使用名为tree-mirror.js的开源库,它使用mutation-summary.js来执行DOM镜像。

一切都很好但是iframe。当主文档包含iframe时,这些库不会捕获iframe对iframe文档的更改。我可以通过阅读tree-mirror.js的代码来弄清楚它是将变异观察者绑定到主文档但是不明白它是否也可以自动处理iframe文档。

我不确定图书馆是否支持这项工作,或者我错过了什么。有没有人使用这些库并遇到过这个问题?请帮助。

1 个答案:

答案 0 :(得分:-1)

修改:感谢wOxxOm在上一个回答中指出了错误的结论。

简而言之,观察iframe内部的变化似乎并没有得到MutationObserver API的支持。请考虑以下示例:

var m = new MutationObserver((mutations) => {
  mutations.forEach((mutation) => {
    console.log(mutation) 
  });
});

// We observe child list and subtree changes
m.observe(document.body, {childList: true, subtree: true});

// Let's create an iframe
var iframe = document.createElement("iframe");

// A mutation record will be logged here
document.body.appendChild(iframe);

// However this will NOT log a mutation record
iframe.contentDocument.body.appendChild(document.createElement("div"));

所以我担心你在这里运气不好。就像上面的评论中所说的那样,你必须在每个iframe中初始化一个新的变异观察者,以便能够观察他们的DOM变化。没有提到的库支持这一点,因为它们主要是本机MutationObserver API的包装器。