Javascript 获取iframe的文档对象_Javascript_Dom_Iframe

Javascript 获取iframe的文档对象

javascript dom iframe

Javascript 获取iframe的文档对象,javascript,dom,iframe,Javascript,Dom,Iframe,我试图获取iframe的document对象，但我在谷歌搜索的示例似乎都没有帮助。我的代码如下所示： <html> <head> <script> function myFunc(){ alert("I'm getting this far"); var doc=document.getElementById("frame").document;

我试图获取iframe的document对象，但我在谷歌搜索的示例似乎都没有帮助。我的代码如下所示：

<html>
    <head>
        <script>
            function myFunc(){
                alert("I'm getting this far");
                var doc=document.getElementById("frame").document;
                alert("document is undefined: "+doc);
            }
        </script>
    </head>
    <body>
        <iframe src="http://www.google.com/ncr" id="frame" width="100%" height="100%" onload="myFync()"></iframe>
    </body>
</html>


函数myFunc（）{
警惕（“我要走这么远”）；
var doc=document.getElementById（“框架”）.document；
警报（“文档未定义：+doc”）；
}

我已经测试过我能够获得iframe对象，但是.document不起作用，.contentDocument也不起作用，我想我也测试过其他一些选项，但是所有这些选项都返回未定义的，甚至是那些本应该起作用但对我不起作用的示例。我已经有了iframe对象，现在我只需要它的document对象。我已经在Firefox和Chrome上进行了测试，但没有结果。

请尝试以下方法

var doc=document.getElementById("frame").contentDocument;

// Earlier versions of IE or IE8+ where !DOCTYPE is not specified
var doc=document.getElementById("frame").contentWindow.document;

注意：AndyE指出所有主流浏览器都支持

contentWindow

，因此这可能是最好的方法

注2：在此示例中，您将无法通过任何方式访问文档。原因是您无法访问具有不同来源的iframe的文档，因为它违反了“相同来源”安全策略

var ifrm = document.getElementById('myFrame');
ifrm = (ifrm.contentWindow) ? ifrm.contentWindow : (ifrm.contentDocument.document) ? ifrm.contentDocument.document : ifrm.contentDocument;
ifrm.document.open();
ifrm.document.write('Hello World!');
ifrm.document.close();

内容窗口与内容文档

IE（Win）和Mozilla（1.7）将返回带有oIFrame.contentWindow的iframe

Safari（1.2.4）不了解该属性，但确实有 oIframe.contentDocument，它指向内部的文档对象 iframe

为了使它更复杂，Opera 7使用 oIframe.contentDocument，但它指向 iframe。因为Safari无法直接访问窗口对象我们的现代跨浏览器兼容代码将只能访问 iframe中的文档

要获得更高的健壮性，请执行以下操作：

function getIframeWindow(iframe_object) { var doc; if (iframe_object.contentWindow) { return iframe_object.contentWindow; } if (iframe_object.window) { return iframe_object.window; } if (!doc && iframe_object.contentDocument) { doc = iframe_object.contentDocument; } if (!doc && iframe_object.document) { doc = iframe_object.document; } if (doc && doc.defaultView) { return doc.defaultView; } if (doc && doc.parentWindow) { return doc.parentWindow; } return undefined; }
及

在我的情况下，这是由于相同的原产地政策。为进一步解释，声明如下：
如果iframe和iframe的父文档是同一来源，则返回文档（即内联框架嵌套浏览上下文中的活动文档），否则返回null

您只需要突出显示标记，然后单击类似于
{}
的按钮将其缩进为代码。我对你的文章进行了编辑以使其更清晰。和的副本。@jamice，谢谢！我想我必须点击{}每一个新的line@AndyE，我知道它是重复的，但其他示例对我不起作用。好吧，所有浏览器都支持非标准的
contentWindow
属性，所以使用它是最安全的。@而且我能找到的文档没有给出明确的是/否。你有什么我可以参考的吗？@DudeDawg你在这里遇到了同一来源的违规行为。您无法访问来自不同服务器的iframe的
文档
domain@AndyE，@JaredPar：我认为Safari的较旧版本（3.0之前）不支持
contentWindow
，但支持
contentDocument
contentDocument
早在
contentWindow
（DOM 2与HTML5）之前就已经成为一个标准，所以我过去喜欢这样做，但现在
contentWindow
本身使用起来非常安全。在2014年和所有现代浏览器中有没有办法做到这一点？
... var el = document.getElementById('targetFrame'); var frame_win = getIframeWindow(el); if (frame_win) { frame_win.targetFunction(); ... } ...