【问题标题】:Adding JS to an empty iframe将 JS 添加到空的 iframe
【发布时间】:2015-06-15 17:21:37
【问题描述】:

我正在尝试将 JavaScript 文件添加到 iframe 的标题中,以便在加载时,iframe 可以在我的“后台任务”之前。目前 iframe 是空的,因为没有我希望它显示的源。也就是说,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.");

【问题讨论】:

  • iframe被解析后,你必须调用addScript
  • @Teemu 哪个iframe?实际元素还是变量?
  • 元素必须存在才能使用getElementById 获得对它的引用。

标签: javascript html iframe


【解决方案1】:

可以直接添加内容字符串

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);

【讨论】:

    【解决方案2】:

    您应该在某些呼叫中使用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);
    

    【讨论】:

    • "未捕获的 TypeError: 无法读取属性 'contentWindow' of null"
    • 对不起,我只更改了下面的部分,所以我没有想到在它上面包含iframe 的声明。我更新了答案
    猜你喜欢
    • 1970-01-01
    • 2014-03-01
    • 1970-01-01
    • 1970-01-01
    • 2021-07-08
    • 2014-12-16
    • 2011-10-21
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多