如何在 iframe 中插入 html答案

【问题标题】：How to insert html in iframe如何在 iframe 中插入 html
【发布时间】：2011-02-16 09:12:03
【问题描述】：

大家好：我需要在 iframe 中插入一个 html 字符串，如下所示：

....

var html = "<html><head><title>Titolo</title></head><body><p>body</p></body></html>"

jQuery('#popolaIframe').click(function() {
  parent.$("#indexIframe")[0].documentElement.innerHTML = html;     
});

有没有办法做到这一点？

【问题讨论】：

作为一种可能的替代方案（不知道您想要实现什么）：考虑使用带有overflow:auto; 的 div 来获得“iframe”效果（= 带有专用滚动条的有界区域）。
div 不是替代品，因为我收到一个带有 head 标签的 html。使用这样形成的 html 填充 div 会导致浏览器删除所有头部内容。
是的，我看到了你的问题。但是，您可能必须追求这种思路，据我所知，这是 JavaScript 的同源策略所涵盖的那种事情 - 所以您可能必须提取 <body>部分和您需要保留的任何标题数据（例如样式表）。不管怎样，祝你好运。 :)

标签： html iframe inject

【解决方案1】：

您发布的代码有效吗？如果不是，可能是因为浏览器出于安全原因不允许修改 iframe 内容。

【讨论】：

代码不起作用。这下面的工作。 parent.$("#indexIframe")[0].contentDocument.body.innerHTML = "foo";问题是，因为我收到了一个格式良好的带有头部内容的 html，所以我不能把它放在 contentDocument.body 中。

【解决方案2】：

看起来你可以重温身体，所以我不明白为什么不这样做：

http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_iframe_contentdocument

【讨论】：

不，我不能引用正文：因为我必须用头部和正文注入正确的 html：真正的 html 是这样的：var html = '
body
';如果我在 document.body.innerHTML 中插入 html，所有的头部内容都会被删除。亲切的问候
虽然一般情况下在body里是不受欢迎的……如果把link标签放在body里行吗？
它适用于浏览器，因为浏览器不会剪切定义。我收到带有 ie6 的 jQuery api clone() 的问题，该问题是由正文中的链接标签引起的。仍在寻找.... :)

【解决方案3】：

你已经失去了1级，你需要修改body的innerHtml，而不是document：

document.body.innerHTML = bla-bla

【讨论】：

【解决方案4】：

var html = "<html><head><title>Titolo</title></head><body><p>body</p></body></html>"

jQuery('#popolaIframe').click(function() {
  var doc = parent.$("#indexIframe")[0].documentElement;
  doc.open();
  doc.write(html);
  doc.close();     
});

【讨论】：

我想不出这个解决方案，这对我有用：mydoc = document.getElementById('iframe_id').contentWindow.document; mydoc.write(html_code); mydoc.close();
我认为这里不需要document.close，因为document.write 自己会这样做。 .close 也隐含地发生了。

【解决方案5】：

除非您remove() iframe 并使用“append(html)”，否则您无法插入 iframe。您可以将其插入 iframe 正文中，如

$('body',parent.$("#indexIframe")[0].contentWindow.document).html(html)

【讨论】：

【解决方案6】：

如果不确定父元素，你可以这样做：

var doc = $.find("#myIframe")[0].contentWindow.document; //that will look in the whole dom though
doc.open();
doc.write(html);

至少在我的情况下这完成了工作:)

【讨论】：