使用 jquery 或 javascript 将 iframe 的内容复制到 div 中答案

【问题标题】：Copy content of iframe into a div with jquery or javascript使用 jquery 或 javascript 将 iframe 的内容复制到 div 中
【发布时间】：2016-08-03 17:19:03
【问题描述】：

我想将部分 html 内容（在 iframe 内）复制到外部 div 中。在我的页面中，我在 iframe 中有一个表单，我想复制此表单的某些部分并附加到 iframe 之外的另一个 div 中。

例如。

<section>       
<iframe id="reg01" class="registration-form" name="registration" src="https://www.website.com/registrationSteps/newUser.jsp" width="100%" height="500" frameborder="0" marginheight="0" marginwidth="0" scrolling="no"></iframe>

<div id="registration"> Some content of iframe here </div>

</section>

【问题讨论】：

如果您使用的是 jQuery，您可以使用 $('iframe').contents() 获取 iframe 的内容
你试过 .clone() 函数吗？ link
我试过这个 $("#ref01").contents().find("html").html().appendTo("#registration");
在检查器中看到此错误：未捕获的安全错误：无法从“HTMLIFrameElement”读取“contentDocument”属性：阻止具有“webiste.co”来源的框架访问具有“website.com”来源的框架”。请求访问的帧具有“http”协议，被访问的帧具有“https”协议。协议必须匹配。

标签： javascript jquery html iframe

【解决方案1】：

您不能直接使用 Jquery 的 contents() 方法复制内容，因为它只能在同一主机上工作。

如果 iframe 来自不同的域，您需要做一些特殊的事情来将 iframe 内容复制到 div。

有关相同问题，请参阅此帖子。 Copy html content from iframe into div ( ajax )?

【讨论】：