访问最简洁的跨浏览器方式是什么？元素的窗口和文档？

Question

我试图找出从父页面访问 元素的 window 和 document 属性的最佳方法。 可以通过 JavaScript 创建或通过存储在对象属性或变量中的引用访问，因此，如果我理解正确的话，就排除了 document.frames 的使用。

我见过很多方法，但我不确定最好的方法。给定以这种方式创建的 ：

var iframe = document.createElement('iframe');
document.getElementsByTagName('body')[0].appendChild(iframe);

我目前正在使用它来访问 document，并且它似乎在主要浏览器上工作正常：

var doc = iframe.contentWindow || iframe.contentDocument;
if (doc.document) {
  doc = doc.document;
}

我已经还可以看到这种方法：

var iframe = document.getElementById('my_iframe');

iframe = (iframe.contentWindow) ? iframe.contentWindow :
         (iframe.contentDocument.document) ? iframe.contentDocument.document :
         iframe.contentDocument;

iframe.document.open();
iframe.document.write('Hello World!');
iframe.document.close();

这让我感到困惑，因为似乎如果定义了 iframe.contentDocument.document ，您最终将尝试访问 iframe.contentDocument.document.document /代码>。

还有这样的：

var frame_ref = document.getElementsByTagName('iframe')[0];

var iframe_doc = frame_ref.contentWindow ? frame_ref.contentWindow.document :
    frame_ref.contentDocument;

最后，我想我对哪些属性持有哪些属性感到困惑，contentDocument是否相当于document或者是否存在这样的属性contentDocument.document 等。

任何人都可以向我指出有关这些属性的准确/及时的参考，或者快速介绍如何有效访问 ' s window 和 document 属性以跨浏览器的方式（不使用 jQuery 或其他库）？

感谢您的帮助！

Answer 1

有一种更简单的方法已经存在了很长时间......使用 window.frames 来获取对框架的窗口对象的引用。

按名称或 ID：

var iframe_doc = window.frames.my_iframe.document;

或者如果您愿意：

var iframe_doc = window.frames['my_iframe'].document;

或按索引：

var iframe_doc = window.frames[0].document;

这里是 window.frames 的良好参考：http://developer.mozilla.org/en/DOM/window.frames

摘录：

window.frames 中的每个项目
伪数组代表窗口
对应于给定的对象
或

Answer 2

在这段时间里，我做了很多测试，最后想出了这个简短但强大的语法，它适用于我可以测试的每个浏览器：

var doc = iframe.contentDocument ?
iframe.contentDocument : (iframe.contentWindow.document || iframe.document);

编辑： @DaggNabbit 注意到 iframe.contentWindow 中存在引用错误.document，如果未设置iframe.contentWindow，则会阻止代码执行，不允许返回iframe.document。
所以我改进了我的代码：

var doc = iframe.contentDocument ?
    iframe.contentDocument :
    (iframe.contentWindow ? iframe.contentWindow.document : iframe.document);

注意：iframe.document 是 IE5 的解决方法。

Answer 3

除 Chrome 之外的所有现代浏览器都支持 iframereference.contentWindow 和 iframereference.contentDocument，但前提是在 iframe 中打开的页面与包含iframe。

要包含 Chrome，请使用 var iwin=iframereference.contentWindow，
idoc=iwin.document;

.contentDocument 是 iframe 中页面的 window.document，
与 contentWindow.document 相同，但不是 .contentDocument.document。

Chrome 可能会在未来的某个版本中支持 .contentDocument - 我希望如此，因为这也是所有其他浏览器查找 Object 元素中包含的文档的方式，输入 text/html< /code>，其中 data 属性是 html 页面的 url。

Answer 4

我认为这是一种非常简单且跨浏览器的

//get document object of IFRAME
if(typeof frame.contentDocument!='undefined') {
    iframeDocument=frame.contentDocument;
} else {
    iframeDocument=frame.document;
}
//get window object of IFRAME
if(typeof frame.contentWindow!='undefined') {
    iframeWindow=frame.contentWindow;
} else {
    iframeWindow=frame.window;
}

测试方式