Question

我有这段代码。我可以看到iframe内容，但似乎edp0始终未定义。为什么呢？

<!DOCTYPE html><html>
<body>
   <iframe src="DOM-copyB.html"></iframe>
   <script>
      ed = document.getElementsByTagName('iframe')[0].contentDocument;
      edp0 = ed.getElementsByTagName('p')[0];
      edp1 = ed.getElementsByTagName('p')[1];
      alert(edp0);
   </script>
</body></html>

这是DOM-copyB.html：

<!DOCTYPE html><html><head></head>
<body>
   <p>A<b>B</b>C</p>
   <p>1<b>2</b>3</p>
</body></html>

Answer 1

我不确定javascript。但是使用jQuery会容易得多：

<iframe src="DOM-copyB.html" id="myFrame"></iframe>

<script>
$("#myFrame").contents().find("p");
</script>

Answer 2

您的JavaScript可能在加载iframe内容之前运行。尝试在window.onload中运行您的代码，看看是否有帮助：

window.onload = function() {
    ed = document.getElementsByTagName('iframe')[0].contentDocument;
    edp0 = ed.getElementsByTagName('p')[0];
    edp1 = ed.getElementsByTagName('p')[1];
    alert(edp0);
};

但是，如果您没有从服务器运行代码，我怀疑在您获得成功引用iframe内容的代码后，您会因为Cross而在Chrome控制台中收到此类错误 - 原始安全：

Uncaught SecurityError: Failed to read the 'contentDocument' property from 'HTMLIFrameElement': Blocked a frame with origin "null" from accessing a frame with origin "null". Protocols, domains, and ports must match.

如果从服务器运行它们，该错误应该消失。有关详细信息，请参阅此问题： Using iframe with local files in Chrome

为什么我不能在iframe中获取外部节点？

2 个答案: