Question

我有一个iframe。当我以正常方式加载iframe时，所有$(document)都会引用iframe文档。

但是当我从主窗口向iframe主体注入一些脚本时，$(document)引用主文档而不是iframe。

我需要注入$(document)引用iframe文档，而不是主文档。

我该如何解决这个问题？

更新

http://jsfiddle.net/methmad9/5/

您可以在控制台中看到注入$(document)显示的内容与$(document)

相同

Answer 1

使用.contents()方法

var script = document.createElement( 'script' );
script.type = 'text/javascript';
script.src = url;
$("#iFrameID").contents().find('head').append( script );

Answer 2

问题来自使用$.globalEval的jQuery：

此方法与使用普通JavaScript eval（）的行为不同因为它是在全球范围内执行的（这很重要用于动态加载外部脚本。）

来自jQuery的源代码domManip方法：

// Evaluate executable scripts on first document insertion
for ( i = 0; i < hasScripts; i++ ) {
    node = scripts[ i ];
    if ( rscriptType.test( node.type || "" ) &&
        !jQuery._data( node, "globalEval" ) && jQuery.contains( doc, node ) ) {

        if ( node.src ) {
            // Hope ajax is available...
            jQuery._evalUrl( node.src );
        } else {
            jQuery.globalEval( ( node.text || node.textContent || node.innerHTML || "" ).replace( rcleanScript, "" ) );
        }
    }
}

从append方法调用：

append: function() {
    return this.domManip( arguments, function( elem ) {...});
}

要解决您的问题，您可以使用javascript appendChild代替，例如：

var head = $("#myframe")[0].contentWindow.document.getElementsByTagName('head')[0];
var script = document.createElement('script');
script.innerHTML = 'console.log("injected script using javascript appendChild:" ); console.log(document);';
head.appendChild(script);

iframe内的$（document）对于注入的脚本无法正常工作

2 个答案:

-=DEMO=-