Javascript 如何将HTML内容设置为iframe_Javascript_Html_Iframe_Internet Explorer 8_Internet Explorer 9

Javascript 如何将HTML内容设置为iframe

javascript html iframe internet-explorer-8

Javascript 如何将HTML内容设置为iframe,javascript,html,iframe,internet-explorer-8,internet-explorer-9,Javascript,Html,Iframe,Internet Explorer 8,Internet Explorer 9,我有一个HTML字符串你好，世界我想用JavaScript将其设置为iframe。我正在尝试如下设置HTML： contentWindow.document.body.innerHTML 或 contentDocument.body.innerHTML 或 document.body.innerHTML 但IE给出了“访问被拒绝”或“对象不支持此属性或方法”或“操作的最终元素无效”错误这是我的全部代码： $（文档）.ready（函数（）{ var htmlString=“你好世

我有一个HTML字符串


你好，世界

我想用JavaScript将其设置为iframe。我正在尝试如下设置HTML：

contentWindow.document.body.innerHTML

或

contentDocument.body.innerHTML

或

document.body.innerHTML

但IE给出了“访问被拒绝”或“对象不支持此属性或方法”或“操作的最终元素无效”错误

这是我的全部代码：


$（文档）.ready（函数（）{
var htmlString=“你好世界”；
var myIFrame=document.getElementById（'iframe1'）；
//开放式评论
//myIFrame.contentWindow.document.body.innerHTML=htmlString；
//myIFrame.contentDocument.body.innerHTML=htmlString；
//myIFrame.document.body.innerHTML=htmlString；
//myIFrame.contentWindow.document.documentElement.innerHTML=htmlString；
});
这是iframe：


您的浏览器不支持iFrame

document.documentElement.innerHTML怎么样。但是要知道，页面中的所有内容都将被替换，即使是执行该操作的脚本

对于iframe来说，它是这样的

myIFrame.contentWindow.document.documentElement.innerHTML

，

innerHTML

有点棘手，特别是在IE中，像

thead

这样的元素是只读的，会造成很多麻烦

根据msdn上的文档，您可以尝试提供

innerHTML

属性的

documentMode

myIFrame = myIFrame.contentWindow ||
    myIFrame.contentDocument.document ||
    myIFrame.contentDocument;
myIFrame.document.open();
myIFrame.document.write('Your HTML Code');
myIFrame.document.close();

这可能只适用于IE

您可以使用：

document.getElementById('iframe1').contentWindow.document.write("<html><body>Hello world</body></html>");

document.getElementById（'iframe1'）.contentWindow.document.write（“Hello world”）；

下面是一个在所有主要浏览器中都能工作的

请注意，您应该使用

contentWindow.document.write

，而不是

contentDocument.write

：这使它在IE7中也能工作。

尝试一下：

$('iframe').load(function() {
    $(this).contents().find('body').append("Hello world");
});

更新：

$(function(){
    $('iframe').load(function() {
        $(this).contents().find('body').append("Hello world");
    }); 
})

var htmlString=“你好世界”；
var myIFrame=document.getElementById（'iframe1'）；
myIFrame.src=“javascript:”+htmlString+”；

有了html5，你就可以使用了。

我对这里的答案“来源”有疑问。这就是我的工作方式：

const frame1 = document.createElement('iframe');
frame1.name = 'frame1';
//not have to set this style,just for demo
frame1.style.position = 'absolute';
frame1.style.height = '800px';
frame1.style.top = '100px';
frame1.style.left = '100px';
frame1.style.background = 'white';

document.body.appendChild(frame1);
const frameDoc =
  frame1.contentWindow || frame1.contentDocument.document || 
  frame1.contentDocument;

frameDoc.document.write('<html><head><title></title><body>Hello world</body></html>');
frameDoc.document.close();

const frame1=document.createElement（'iframe'）；
frame1.name='frame1'；
//不必设置此样式，仅用于演示
frame1.style.position='absolute'；
frame1.style.height='800px'；
frame1.style.top='100px'；
frame1.style.left='100px'；
frame1.style.background='白色'；
document.body.appendChild（frame1）；
常量框架文件=
frame1.contentWindow | | frame1.contentDocument.document |
框架1.内容文件；
frameDoc.document.write（'helloworld'）；
frameDoc.document.close（）；

谢谢你的回答，但是如果我使用这个代码，比如说这个错误：“操作的最后一个元素无效。”为什么你不加载一个页面，它工作得很好？为什么要使用字符串来加载？让我知道注意，如果您在iframe中读写，您将需要编写document.getElementById（'iframe1'）.contentWindow.document.write（“”）；让空字符串读取如下变量iframe\u html=document.getElementById（'iframe\u exe\u uploader'）。contentWindow.document.body.innerHTML；我需要使用open/close来让它在chrome中工作：iframe.contentWindow.document.open（'text/htmlreplace'）；iframe.contentWindow.document.write（内容）；iframe.contentWindow.document.close（）；如果不想追加，可以使用

document.getElementById（'output\u iframe1'）.src=“data:text/html；charset=utf-8，”+转义（html\u字符串）。
const frame1 = document.createElement('iframe');
frame1.name = 'frame1';
//not have to set this style,just for demo
frame1.style.position = 'absolute';
frame1.style.height = '800px';
frame1.style.top = '100px';
frame1.style.left = '100px';
frame1.style.background = 'white';

document.body.appendChild(frame1);
const frameDoc =
  frame1.contentWindow || frame1.contentDocument.document || 
  frame1.contentDocument;

frameDoc.document.write('<html><head><title></title><body>Hello world</body></html>');
frameDoc.document.close();