从iframe重用jQuery对象？
我有一个WYSIWYG应用程序，它使用iframe将div转换为编辑器。 应用程序内部使用jQuery和jQuery UI作为其核心库。 为了扩展应用程序的function，我考虑使用jQuery和jQuery UI ，这在我的父DOM是不可用的
我有两个选择
在我的父DOM加载库。从iframe本身获取库并开始扩展应用程序，即jQuery = window.frames[0].jQuery 。
后者使我无法将其加载到我的父DOM ，但是我遇到了一个问题，其中Dialog Select菜单无法按预期工作。 它根本没有显示选项。 代码类似于：
// Here I chose both jQuery from parent and // jQuery = window.frames[0].jQuery div = jQuery("") div.append("FooBar") jQuery("body").append(div) div.dialog{appendTo:editorID} //Editor is in iframe
有谁知道当你这样做时会发生什么jQuery = window.frames[0].jQuery ？ 这个jQuery对象是一直在操纵iframe DOM而不是父DOM吗？ 或者jQuery与新DOM一起工作得很好。
只要符合以下条件，就可以将iframe中的内容复制到父页面：
父页面（托管iframe的页面）和子页面（iframe内的页面）都符合同源策略 ：
两个页面必须匹配：
- 协议（例如
http:和https:会失败）- 子域名（例如
http://app.domain.com和http://www.domain.com失败）*- 域名（不用说
apples.com和oranges.org失败）- 端口（例如
https://www.generic.com:8080和https://www.generic.com:8088失败）
*有办法解决这个问题
在我的脑海中，我知道两种传输节点的JavaScript方法：
-
document.importNode()副本 -
document.adoptNode()移动
应该使用
document.importNode()（或使用document.adoptNode()）克隆外部文档中的节点，然后才能将它们插入到当前文档中。 从外部文档克隆到当前文档时，不鼓励使用node.cloneNode()。
第一个演示使用iframe加载后的importNode()来复制iframe中的外部页面的主体并将其附加到
（可以使用任何块元素）。
第二个演示在click事件上使用importNode() 。 要查看结果，请单击按钮，然后向下滚动。
注意：此过程也适用于块。
http://plnkr.co/edit/yUW2CYqDqrvEq5fT1ty6?p=preview
JavaScript的
iFrame1.onload = function() { bodySnatcher('#iFrame1', '#display'); } var btn1 = document.getElementById('btn1'); btn1.addEventListener('click', function() { bodySnatcher('#iFrame2', '#display'); }, false); function bodySnatcher(iframe, parent) { var iFrame = document.querySelector(iframe); var iBody = iFrame.contentWindow.document.getElementsByTagName("body")[0]; var imported = document.importNode(iBody, true); document.querySelector(parent).appendChild(imported); }
jQuery缓存对文档的引用。 但是，您可以从同源iframe借用jQuery，并且您将主要无法依赖$(selector)隐式搜索文档 – 相反，您可以执行$(document).find(selector) 。
jQuery = $(window).parents().frames[0].jQuery //parent()