Question

我正在尝试使用以下代码获取IFrame内部HTML。

 <iframe src="http://www.msn.com" 
         width="100%" height="100%" marginwidth="0"
         scrolling="no" frameborder="0" id="divInfo" 
         onreadystatechange="MyFunction(this);"></iframe>

JavaScript代码

  function MyFunction(frameObj)
    {
        if (frameObj.readyState == "complete")
        {
            alert(frameObj.document.body.innerHTML); 
        }
    }

但是警报显示了当前文档的HTML。当frmae ready状态完成时，如何获得iframe的内部HTML。

如果我使用alert(frameObj.contentWindow.document.body.innerHTML);，它会让我拒绝访问错误。

提前致谢。

Answer 1

拒绝访问错误是由相同的原始策略引起的。

由于您的网页托管在http://www.example.com/上（例如），如果您尝试访问http://www.msn.com/上的详细信息，浏览器将不会允许您，因为它们来自2个不同的域。

但是，如果您尝试访问同一域中的数据 - 托管页面：http://www.example.com/index.html，IFrame的页面：http://www.example.com/iframe.html，那么您应该能够获取内容。

有关同源政策的更多信息，请点击以下链接：http://en.wikipedia.org/wiki/Same_origin_policy

顺便说一句，你可能想要使用frameObject.contentDocument而不是

<script type="text/javascript">
function documentIsReady(frameObject) {
  alert(frameObject.contentDocument.body.innerHTML);
}
</script>

...你也可以使用onload而不是onreadystatechange ...

<iframe src="iframe.html" onload="documentIsReady(this);"></iframe>

Answer 2

您无法读取<iframe>的内容，该内容来自与父网页不同的域中的内容。

Answer 3

如果它符合same origin policy（意味着iframe与父文档位于同一服务器上），则只能这样做。

无论如何，这回答了here：）

Answer 4

如前所述，如果<iframe>的来源不是来自同一个来源，则无法获取$('#div').load('http://www.google.com');的内容。

这也适用于获取外部内容的大多数其他方式，例如使用ajax从其他页面加载源代码。即：example.com/hello.html

要加载外部内容，内容必须符合same origin policy.

这意味着内容必须位于同一协议和主机上。

上面链接的维基百科文章：

http：// www.example.com / dir / page2.html - ＆gt; 成功相同的协议和主机

http：// www.example.com / dir2 / other.html - ＆gt; 成功相同的协议和主机

httpː//用户名：password@www.example.com/dir2/other.html - ＆gt; 成功相同的协议和主机

http：// www.example.com:81 / dir / other.html - ＆gt; 失败相同的协议和主机但不同的端口

https://www.example.com/dir/other.html - ＆gt; 失败不同协议

http://en.example.com/dir/other.html - ＆gt; 失败不同的主机

http://example.com/dir/other.html - ＆gt; 失败不同的主机（需要完全匹配）

http://v2.www.example.com/dir/other.html - ＆gt; 失败不同的主机（需要完全匹配）

简单地说，它必须在同一个网站上。因此，虽然example.com/goodbye.html可以从google.com/content.html加载内容，但却无法从weebly.com/hello.html加载内容

此外，它必须位于同一个域中。子域被视为对相同的域策略进行了VOID，因此虽然weebly.com/goodbye.html可以从user1.weebly.com/content.html加载内容，但却无法从{{1}}加载内容

当然，有一些解决方法，像往常一样，~~但这是另一个故事。~~实际上，这与问题非常相关。所以here is a wonderful questions 'thread' on all the ways to bypass it.

使用JavaScript获取IFrame innerHTML

4 个答案:

上面链接的维基百科文章：