iframe document.write中的javascript覆盖父文档

Question

我想通过Javascript将HTML作为字符串加载到iframe 。 像这样：

$('#iframe1').contents().find('html').html("<h1>This is an iframe</h1>");

直到我发现，在这种HTML向上的Javascript之类的document.write它们正在写入错误的文档->父文档！

这是一个显示它的柱塞： http ://plnkr.co/edit/YQAqqSDCVKnP3uhLj4lF?p=preview

如果我通过src将相同的HTML作为外部文档通过src加载到iframe ，则document.write将转到iframe （而不是父document.write ），这正是我所期望的。

有一些见解吗？ 如何告诉浏览器在执行Javascript之前正确创建iframe文档作用域？

---

PS：其目的是为了预览，因此我注入了（可信任！）源的HTML代码，但在该代码中允许document.write。

Answer 1

好。 srcdoc在这里srcdoc 。

$('#iframe1').attr({srcdoc:intrusiveHTML});

我更新了Plunker。

使用srcdoc ，Javascript不会随文档范围而滑落。

它在IE中不起作用（ http://caniuse.com/#feat=iframe-srcdoc ），因此另外使用Polyfill可能会有所帮助： https : //github.com/jugglinmike/srcdoc-polyfill

但是我还没有测试。

Answer 2

代替使用document.write ，而使用document.getElementById('iframe1').contentWindow.document.write 。 因为当您指向文档时它将获取主窗口文档，所以我们需要指出需要使用哪个iframe副本。