iframe 显示：没有不起作用答案

【问题标题】：iframe display:none not workingiframe 显示：没有不起作用
【发布时间】：2014-04-30 16:38:37
【问题描述】：

我的代码是：

<!DOCTYPE html>
<html>

  <body>
    <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
    <iframe src="http://www.amway.in/Shopping/Products.aspx?pid=101154IDK&ctg=Nutrilite">
    <p>Your browser does not support iframes.</p>
    </iframe>
  </body>

  <style>
    iframe::-webkit-scrollbar {  
      display: none;
    }
iframe {
  width: 600px;
  height: 800px;
}
  </style>

  <script>
$(window).bind("load", function() {
    $("iframe").contents().find(".left-nav").css("display","none");
});
  </script>

</html>

我想将 css 属性“display”更改为“none”，但页面加载后显示错误。

未捕获的安全错误：无法从“HTMLIFrameElement”读取“contentDocument”属性：阻止具有“null”来源的框架访问具有“http://www.amway.in”来源的框架。请求访问的帧具有“文件”协议，被访问的帧具有“http”协议。协议必须匹配。

【问题讨论】：

如果您从其他域获取页面，则无法修改 iframe 的内容

标签： jquery html css

【解决方案1】：

这是因为同源政策。

同源策略限制从一个源加载的文档或脚本如何与另一个源的资源交互。 [...]

跨域脚本API访问

iframe.contentWindow、window.parent、window.open 和 window.opener 等 JavaScript API 允许文档直接相互引用。 当两个文档的来源不同时，这些引用提供对 Window 和 Location 对象的有限访问。一些浏览器允许访问比规范允许的更多的属性。您可以改用window.postMessage 在文档之间进行通信。

您可以阅读有关此主题的更多信息here。

【讨论】：