如何在Javascript中的iframe元素中获取元素?

时间:2011-10-20 13:21:05

标签: javascript google-chrome iframe

我在文档中有一个如下元素,我可以通过document.getElementById('iframe_id')获取iframe元素,但是如何在iframe中获取元素?我尝试了iframeElement.contentWindow,并且返回的DOMWindow没有属性。还尝试了iframeElement.docuemntiframeElement.contentDocument,两者都未定义。我怎么才能得到它?我在实验中使用了最新的Chrome。

这是iframe元素

<iframe id='iframe_id'>
<html>
<body>many content here</body>
</html>
</iframe>

3 个答案:

答案 0 :(得分:5)

如果内容与询问它的脚本具有相同的协议,域和端口号,则只能查询iframe中的内容。它被称为SAME ORIGIN

如果是这种情况,则此代码将显示内容。如果不是 - 您无法从普通html页面中的普通脚本访问iframe

Demo - 在IE8,Chrome 13和Fx6中测试

function showIframeContent(id) {
  var iframe = document.getElementById(id);
    try {
      var doc = (iframe.contentDocument)? iframe.contentDocument: iframe.contentWindow.document;
      alert(doc.body.innerHTML);
    }
    catch(e) {
       alert(e.message);
    }
  return false;
}


<iframe id='iframe_id1' src="javascript:parent.somehtml()"> </iframe>
<br/>
<a href="#" onclick="return showIframeContent('iframe_id1')">Show</a>
<hr/>

<iframe id='iframe_id2' src="http://plungjan.name/"> </iframe>
<br/>
<a href="#" onclick="return showIframeContent('iframe_id2')">Show</a>
<hr/>

答案 1 :(得分:4)

有:

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

要获取您可以使用的内容文档:

var contDoc = iframe.contentDocument || iframe.contentWindow.document;

然后,您可以通过id。

在iframe中搜索您的元素

答案 2 :(得分:0)

您应该可以通过document.getElementById('yourIFrame').document.getElementById('yourElement')

访问它