Javascript 设置 iframe innerHTML 而不在其中加载页面（使用 jquery）
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8226307/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Set iframe innerHTML without loading page in it (with jquery)
提问by Leto
I want to set the contents of an iframe dynamically, when no pages were loaded before in the iframe.
我想动态设置 iframe 的内容，当 iframe 中之前没有加载页面时。
I'm doing that :
我正在这样做：
iframe = $('<iframe id="thepage"></iframe>');
iframeHtml = 'iframeHtml';
$('body').append(iframe);
iframe
.contents()
.html(iframeHtml);
But it is not working, the html is still empty.
但它不起作用，html 仍然是空的。
回答by newtover
the best way to populate frame contents is document.write
填充框架内容的最佳方法是 document.write
var dstFrame = document.getElementById('yourFrameId');
var dstDoc = dstFrame.contentDocument || dstFrame.contentWindow.document;
dstDoc.write(yourHTML);
dstDoc.close()
UPD: that is
UPD：就是
var iFrame = $('<iframe id="thepage"></iframe>');
$('body').append(iFrame);
var iFrameDoc = iFrame[0].contentDocument || iFrame[0].contentWindow.document;
iFrameDoc.write('<p>Some useful html</p>');
iFrameDoc.close();
回答by jkschneider
If you want to avoid using document.write, which is generally not recommended any longer, you can get at the frame contents to add the content:
如果你想避免使用document.write一般不再推荐的 ，你可以在框架内容处添加内容：
iframe = $('<iframe id="thepage"></iframe>')
iframeHtml = 'iframeHtml'
$('body').append(iframe)
iframe.contents().find('body').html(iframeHtml)
回答by Gad Wissberg
Using JQuery, you can edit the iframe's attribute srcdocby passing it the html as string:
使用 JQuery，您可以通过将 html 作为字符串传递给 iframe 的属性srcdoc来编辑它：
$('#iframe_id').attr("srcdoc", htmlString);
回答by Alfgaar
iframe = $('<iframe id="thepage"></iframe>'); iframeHtml = 'iframeHtml'; $('body').append(iframe); iframe .contents() .html(iframeHtml);
iframe = $('<iframe id="thepage"></iframe>'); iframeHtml = 'iframeHtml'; $('body').append(iframe); iframe .contents() .html(iframeHtml);
the reason it does not work is because contents()returns a documentobject and html()only works on HTMLElemntobjects, html()is basically a wrapper around innerHTMLproperty and documentdoes not have such property.
它不起作用的原因是因为contents()返回一个document对象并且html()只适用于HTMLElemnt对象，html()基本上是一个围绕innerHTML属性的包装器并且document没有这样的属性。
回答by Ranjan Singh
Use the jQuery contents() method You can use the jQuery contents() method in combination with the find(), val() and html() method to insert text or HTML inside an iframe body.
使用 jQuery contents() 方法 您可以将 jQuery contents() 方法与 find()、val() 和 html() 方法结合使用，以在 iframe 正文中插入文本或 HTML。
var EditFrame = $("#EditWindow").contents().find('body');var message = "Your message which needs to show in Iframe";EditFrame.html(message);
var EditFrame = $("#EditWindow").contents().find('body');var message = "Your message which needs to show in Iframe";EditFrame.html(message);
