将外部js注入自己创建的iframe

所以我试图将外部css和js注入自创的iframe以提供额外的安全层，因此没有跨域问题。

这是代码

      $(function(){ var contents = $('iframe').contents(); styleTag = $('').appendTo(contents.find('head')); insertScript('https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js'); insertScript('https://myserver.com/myfile.js'); }); var insertScript = function(src){ var script = document.createElement('script'); script.type = 'text/javascript'; script.src = src; $('iframe').contents().find('head').append(script); console.log("add script"); }  
   

正在输入css文件，但js文件都没有，有谁能看到原因？ console.log正在输出。

谢谢

Answer 1

我认为你必须从iframe的文档对象创建脚本元素。 它应该作为contents[0] ，您可以将其传递给insertScript。

如果您直接在头节点（而不是jQuery包装器）上使用appendChild它会起作用：

 $('iframe').contents().find('head')[0].appendChild(script); 

http://jsbin.com/enidiv/1/edit

Answer 2

只要iframe域，协议和端口匹配，您就可以添加脚本。 否则，它被视为访问不同URL的不安全尝试。