1

我创建了一个友好的 iframe（相同的域）并使用 JavaScript 将它添加到 DOM。它在我的页面上可见。检查 HTML 如下所示：

<iframe id="test_frame" frameSpacing="0" height="100" src="javascript:window['contents']" width="100" name="test_frame">
  <!DOCTYPE html>
  <html>
    <head>
      <title>test_frame</title>
      <base target=_top>
    </head>
    <body style="margin: 0px; padding: 0px">
      <p>Hello World</p>
    </body>
  </html>
</iframe>

然后我运行以下命令以访问 iframe 中的标记<body>：

    alert(window.frames["test_frame"].document.body.innerHTML);

bodyInternet Explorer 6-10 失败，因为null. iframe的document对象存在，但似乎没有可读属性。其他浏览器只显示字符串<p>Hello World</p>。

但有趣的是，以下适用于 IE 6-10 和所有其他浏览器：

    window.setTimeout(function(){
      alert(window.frames["test_frame"].document.body.innerHTML);
    }, 1);

据我所知setTimeout，在全局范围内执行传递的函数。所以我尝试使用call但它不起作用：

    (function(){
      alert(window.frames["test_frame"].document.body.innerHTML);
    }).call(window);

我见过类似的情况，在 setTimeout 中包装代码可以解决 IE iframe 问题。IE 背后的机制或逻辑是什么？有适当的解决方法吗？

上面的测试是在标准模式下运行的，除了所述的错误之外没有其他错误。

4

1 回答 1

1

IE 背后的机制或逻辑是什么？有适当的解决方法吗？

该机制非常简单：等待一毫秒（实际上是四毫秒），然后尝试访问 iFrame。

时机就是一切。如果您调用得太快，您将看到一个空的 iFrame。即使src是javascript代码，您也必须让代码运行。

  • 如果您在 DOM 中遇到 iFrame 后立即访问它：它很可能是空的。它尚未从互联网上获取。即使src是javascript:...，iFrame 也会是空的。

  • 如果您在页面加载后 1 毫秒执行此操作，则很可能它还没有被获取。但是，如果它在浏览器缓存中（通常不应该是一个页面）或者它是一个数据（或 javascript，在您的情况下）URL，那么这可能会起作用（尽管没有任何许可）。此时该document.body元素可能已经存在 - 即使它将为空。

  • 预期的工作流程是您等待 iFrameload事件。您可以在创建 iFrame 或设置其src. 找到一组跨浏览器可靠地发送消息的事件是一个棘手的问题，但load应该可以跨浏览器工作。

  • 如果load事件未能足够晚，请多等一毫秒。这不应该是必要的，但 IE 中可能存在一个愚蠢的错误（我认为没有）。

  • 如果您从控制台触发它，这应该是成功的。事实上，根据我的观察，情况一直如此。

于 2013-01-11T23:02:06.200 回答