如何清除 IFRAME 的内容？
Posted
技术标签:
【中文标题】如何清除 IFRAME 的内容？【英文标题】：How to clear the content of an IFRAME? 【发布时间】：2010-12-19 14:15:12 【问题描述】：如何使用 javascript 清除 IFRAME 元素的内容，而不向其中加载空白页面？
我可以想办法做到这一点：iframe_element.src = "blank.html"，但必须有更好的即时方法。
【问题讨论】：
【参考方案1】：about:blank
是一个空白的“URL”。总是很清楚
您可以将页面的来源设置为那个，它会清除。
【讨论】：
iframe_element.src = "about:blank" 执行 document.getElementByid("frame_name").src = about:blank 导致应用在 src = about:blank 时打开一个新的空白页面/标签 @zee 是的，但你可以使用 document.querySelector(".frame_name").contentWindow.location.replace(about:blank);就像一个魅力！【参考方案2】：
var iframe = document.getElementById("myiframe");
var html = "";
iframe.contentWindow.document.open();
iframe.contentWindow.document.write(html);
iframe.contentWindow.document.close();
在 IE、Firefox 和 Chrome 中测试...它做到了 :)
【讨论】：
简单...在我看来最好的方法。我没有使用带有 src 属性的 iframe，所以我宁愿不添加“about:blank”的 src 属性。我正在根据保存在变量中的 HTML 数据加载和清除 iframe，所以这绝对是完美的。【参考方案3】：你的技术是最强大的。它是我自己使用的。有时内容可能通过 HTTPS 传送，使用 about:blank 可能会导致警告消息显示为“您是否要包含来自不安全位置的内容”或类似的内容。
即时的东西是一个感知问题，但是如果您的站点上有一个配置了较长缓存到期的 Blank.html 文件，则客户端将只会获取该页面一次（每个会话最多一次）。
【讨论】：
【参考方案4】：或者你可以这样做：
var iframe_element = window.frames['iframe_name'];
iframe_element.document.open();
iframe_element.document.close();
【讨论】：
如果您想在窗口中添加基本消息（或其他任何内容），您还可以在文档打开时写入文档。【参考方案5】：我在包含许多 IFrame 的页面上遇到了“about:blank”问题。它似乎不是每个浏览器中的有效位置（不过，我从未确定过）。无论如何，我很高兴javascript:void(0);
【讨论】：
禁用 Javascript 会怎样？ 他专门询问如何在 Javascript 之后重置 IFrame 位置。虽然我想象 javascript: urls 优雅地降级，但我不确定。【参考方案6】：你也可以这样做：
<html>
<head>
<script>
var doc = null;
window.onload = function()
alert("Filling IFrame");
doc = document.getElementById("test");
if( doc.document )
document.test.document.body.innerHTML = "<h1>test</h1>"; //Chrome, IE
else
doc.contentDocument.body.innerHTML = "<h1>test</h1>"; //FireFox
setTimeout(function()
alert("Clearing IFrame");
if( doc.document )
document.test.document.body.innerHTML = ""; //Chrome, IE
else
doc.contentDocument.body.innerHTML = ""; //FireFox
, 1000);
;
</script>
</head>
<body>
<iframe id="test" name="test">
</iframe>
</body>
</html>
【讨论】：
【参考方案7】：// 首先我从它的 Id 中获取窗口。
var my_content = document.getElementById('my_iframe').contentWindow.document;
// 然后我通过将body标签内部HTML设置为空字符串来清除它。
my_content.body.innerHTML="";
// 现在，当我编写新内容时，它不会附加到正文的末尾，并且 iframe 正文将只包含新内容。
my_content.write(new_content);
【讨论】：
【参考方案8】：去做吧：
var iframe = document.getElementById("iframe");
iframe.removeAttribute('srcdoc');
在 Chrome 中工作
【讨论】：
恐怕这不能回答问题【参考方案9】：只需获取 iframe 并从中删除 documentElement。 iframe 将是空白的
var frame = document.getElementById("YourFrameId"),
frameDoc = frame.contentDocument || frame.contentWindow.document;
frameDoc.removeChild(frameDoc.documentElement);
【讨论】：
【参考方案10】：function getContentFromIframe(iFrameName)
var myIFrame = document.getElementById(iFrameName);
var content = myIFrame.contentWindow.document.body.innerHTML;
//Do whatever you need with the content
【讨论】：
【参考方案11】：$("#iframe").contents().find("body").html('');
【讨论】：
这没有提供问题的答案。要批评或要求作者澄清，请在他们的帖子下方发表评论 - 您可以随时评论自己的帖子，一旦您有足够的reputation，您就可以comment on any post。 如果 iframe 最初是从与包含页面相同的域加载的，您也只能修改 iframe 的内容。 @PeterL。尽管我同意这个答案太简洁而无用，但从技术上讲，它确实回答了 OP，因为jQuery is JavaScript.以上是关于如何清除 IFRAME 的内容？的主要内容，如果未能解决你的问题，请参考以下文章