2015-06-15 73 views
0

我试图将JavaScript文件添加到iframe的头文件中,以便在加载时,iframe可以在执行“后台任务”之前完成。目前iframe是空的,因为没有我希望它显示的源。也就是说,所有的iframe都会执行我希望提供给它的脚本。从这里将JS添加到空iframe

我已经试过建议:

  1. Can't append <script> element
  2. Insert a Script into a iFrame's Header, without clearing out the body of the iFrame
  3. Invoking JavaScript code in an iframe from the parent page
  4. Calling javascript function in iframe
  5. http://www.getallfix.com/2013/08/how-to-include-or-add-external-javascript-file-to-iframe-how-to-add-js-to-iframe/

然而,我无法得到一个简单的“写”到iframe的工作。 这里是我一起工作的代码:

demo.html

<html> 
<head> 
<script src="demo.js"></script> 

<script> 
addScript('demo.js'); 

function addScript(src){ 
// Find the iFrame 
var iframe = document.getElementById('test'); 
var val = '<scr' + 'ipt type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></scr' + 'ipt>'; 

var headID = iframe.getElementsByTagName("head")[0];   

var newScript = iframe.createElement('script'); 
newScript.type = 'text/javascript'; 
newScript.src = 'demo.js'; 
headID.appendChild(newScript); 

</script> 
</head> 
<body> 
    <div class="output"> 
     <iframe id="test"></iframe> 
    </div> 
</body> 
</html> 

demo.js

document.write("Hello, I'm a Demo."); 
+0

您对呼叫'addScript'后'iframe'已经被解析。 – Teemu

+0

@Teemu哪个'iframe'?实际的元素或变量? – user2958542

+0

在使用'getElementById'获取对它的引用之前,元素必须存在。 – Teemu

回答

0

您应该使用iframe.contentWindow.document,而不是仅仅iframe一些您的通话。此外,demo.js位于外部页面,不在iframe内,因此您需要提供绝对路径(即http://www.example.com/demo.js),或者您需要设置脚本的内容。这为我工作:

var iframe = document.getElementById('test'); 
var headID = iframe.contentWindow.document.getElementsByTagName("head")[0];   

var newScript = iframe.contentWindow.document.createElement('script'); 
newScript.innerHTML = 'document.write("Hello, I\'m a Demo")'; 
newScript.type = 'text/javascript'; 
headID.appendChild(newScript); 
+0

“Uncaught TypeError:无法读取属性'contentWindow'为null” – user2958542

+0

对不起,我只更改了下面的部分,所以我没有想到在其上面包含iframe的声明。我更新了回答 – mpallansch

+0

添加引用:http://www.w3schools.com/jsref/prop_frame_contentwindow.asp –

0

您可以直接添加的内容串

http://jsfiddle.net/0m5axpxx/

var iframe = document.createElement('iframe'); 
var html = '<body><scr'+ 'ipt>alert(1)</s' + 'cript>Content</body>'; 
iframe.src = 'data:text/html;charset=utf-8,' + encodeURI(html); 
document.body.appendChild(iframe);