如何深度克隆iframe？

Question

有没有办法深度克隆iframe？

基本的jQuery克隆只是使用相同的src创建另一个iframe。我想要实现的是一种克隆iframe的方法，它是精确的当前内容（即任何可能的输入值，通过javascript修改任何DOM等。）。

var clone = iframe.contents().find('html').clone();

当我克隆HTML属性及其所有子项，修改等时，我遇到了这些问题：

1. 我错过了DOCTYPE

2. 如何将其插入新的iFrame？

Answer 1

如果您克隆iframe创建另一个iframe，那么深克隆您的iframe！它的源位于其他位置，当您分配其src属性时，它将被下载。

测试

想象一下，您有一个打印当前时间的源（非缓存）页面。在页面上放置iframe，等待10秒然后克隆它。新iframe将下载其内容，第二个iframe将有不同的内容（时间）。

“真正的”深度克隆

编辑：如果您需要深度原始克隆，您可以获取innerHTML并将其注入iframe中。来自Michael Mahemof的解决方案：

// Creates the new iframe, add the iframe where you want
var newframe = document.createElement("iframe");
document.body.appendChild(newframe); 

// We need the iframe document object, different browsers different ways
var frameDocument = newFrame.document;
if (newFrame.contentDocument)
 frameDocument = newFrame.contentDocument;
else if (newFrame.contentWindow)
 frameDocument = newFrame.contentWindow.document;

// We open the document of the empty frame and we write desired content.
// originalHtmlContent is a string where you have the source iframe HTML content.
frameDocument.open();
frameDocument.writeln(originalHtmlContent);
frameDocument.close();

Answer 2

无法克隆contents()：

var clone = iframe.contents().clone();

然后使用以下内容将其插入另一个框架中

iframe2.append(clone);