Question

这听起来很糟糕，但这就是我想用javascript做的事情（这都是由事件处理程序触发的）：

将页面内容（最好是整个文档或至少是documentElement对象）保存到变量中。
创建一个iframe并将其插入身体。
将iframe的文档替换为已保存的文档（以便iframe现在具有与外部页面相同的内容）。
更改外页。

除了关于替换iframe文档的部分外，一切都很花哨。我尝试过很多不同的东西，但都有问题（下面概述了这些问题）。当页面在iframe中时，我需要事件处理程序，样式，链接等才能正常工作。

是的，我知道我可以将iframe的src设置为当前页面的url，但我宁愿页面也不必加载。如果我不能提出解决方案，这就是我要做的。

我已经尝试过的事情：

var html = iframe.contentWindow.document.importNode(document.documentElement, true);
iframe.contentWindow.documentElement = html;

我收到一条错误消息（“设置一个只有getter的属性”）。

var html = iframe.contentWindow.document.importNode(document.documentElement, true);
var idoc = iframe.contentWindow.document;
while(idoc.firstChild) idoc.removeChild(idoc.firstChild);  // remove all children (firefox automatically creates an html element for iframes with no src)
idoc.appendChild(html); // insert a new documentElement

这似乎有效，但不会重新呈现样式，并且事件处理程序不起作用。有趣的是，链接也不起作用，甚至没有使用浏览器的默认样式。也许这是因为DOCTYPE没有复制到iframe？

iframe.contentWindow.document.documentElement.innerHTML = document.documentElement.innerHTML;

这与removeChild / appendChild方法具有相同的行为。

似乎我可以让浏览器重新渲染样式并重新注册事件处理程序然后我会变得很好，但我不确定这是否可能。

Answer 1

关于最后一个方法，也许你正在复制FROM的窗口的DOM还没有加载？

对于Doctype，您可以从头开始重建它，并使用document.write将其插入到html节点之前。

可以通过document.doctype访问doctype，但这只有一个getter。

Answer 2

如果在iframe中加载空的html样板文档怎么样？在某个文件夹中制作文档＆＃34; myFolder / sparePage.html＆＃34;然后做

＆＃13;

var myIframe = document.createElement("iframe");
myIframe.style.display = "none";
document.body.appendChild(myIframe);
function myIframeLdd(){
   console.log("myIframe is loaded");
    //....your iframe ready code here
   myIframe.removeEventListender("load",myIframeLdd,false);
}
myIframe.addEventListener("load", myIframeLdd, false);
myIframe.src = "myFolder/sparePage.html"

＆＃13;

使用javascript将整个文档复制到iframe中

我已经尝试过的事情：

2 个答案: