Question

我需要在沙盒视图中显示内容，主要是完整的html文档（<html>...</html>）。我正在使用带有 src datauri 的沙盒iframe。

var 
  iframe = document.createElement('iframe'),
  content = '<html><head></head><body><h1>Hello</h1></body></html>'
;
iframe.sandbox = '';
iframe.src = 'data:text/html;charset=utf-8,' + content;
document.body.appendChild(iframe);

不幸的是，Internet Explorer不支持... 有解决方案/解决方法吗？

Answer 1

我的解决方案：

创建一个空的index.html，只是为了拥有相同的原始iframe。
通过javascript访问iframe
替换其内容

function ReplaceIframeContentCtrl() {
  var iframe = document.getElementById('test');
  var content = "<html><head></head><body><h1>Hello</h1></body></html>";
  
  iframe.contentWindow.document.open();
  iframe.contentWindow.document.write(content);
  iframe.contentWindow.document.close();
}

document.addEventListener('DOMContentLoaded', ReplaceIframeContentCtrl);

<iframe id="test" src="/index.html"></iframe>

Answer 2

只需创建一个空的iframe并替换它的内容即可：

function insertIframeHtml(parent, html) {
  const jparent=$(parent).empty();
  const iframe=$('<iframe></iframe>').appendTo(jparent)[0];
  iframe.contentWindow.document.open();
  iframe.contentWindow.document.write(html);
  iframe.contentWindow.document.close();
}

IE - IFRAMES / Data Uri

2 个答案: