将JavaScript注入到iframe中未执行(同一域)

时间:2019-05-20 11:16:47

标签: javascript iframe

尝试将js和CSS从父级注入到iframe。样式表和脚本已正确地附加到iframe中的文档中,但由于某些原因,只考虑了css,而不是未执行或无法识别的js。

另一个问题是,每次将某些文件加载​​到需要文件的iframe中时,文件似乎都不是来自缓存,而是通过网络进行请求。这是避免提高性能的方法。

进行了相同的尝试,但定义了从加载在iframe上的文档中注入文件的功能,结果相同:

window.onload = function() {
    if (parent) {
        var iframeHead = document.getElementsByTagName("head")[0];
        var stylesScrtips = parent.document.getElementsByClassName("toInsert");
        for (var i = 0; i < stylesScrtips.length; i++)
            iframeHead.appendChild(stylesScrtips[i].cloneNode(true));
    }
}

参考了不同的讨论

Injected javascript does not execute

inject a javascript function into an Iframe

https://www.sitepoint.com/community/t/iframe-call-js-file/210325/27

在父文档上,定义了以下功能:

document.getElementById('theFrame').onload = function inject(){
    var iFrameHead = window.frames["theFrame"].document.getElementsByTagName("head")[0];

    var theStyle = new Array(5);
    for (var i=0;i<theStyle.length;i++){
        theStyle[i] = document.createElement('link');
        theStyle[i].type = 'text/css';
        theStyle[i].rel = 'stylesheet';
        var styles = $("[rel='stylesheet']").map(function() {
            return this.href;
            }).toArray();
        theStyle[i].href = styles[i];
        iFrameHead.appendChild(theStyle[i]);
    }

    var theScript = new Array(6);
    for (var i=0;i<theScript.length;i++){
        theScript[i] = document.createElement('script');
        theScript[i].type = 'text/javascript';
        var scripts = $("script[src$='.js']").map(function() {
            return this.src;
            }).toArray();
        theScript[i].src = scripts[i];
        iFrameHead.appendChild(theScript[i]);
    }
}

CSS被继承,但是对于JS文件,看到错误“未捕获的ReferenceError:*未定义”。

0 个答案:

没有答案