访问iframe外部的元素

Accessing an element outside of iframe

本文关键字：元素 外部 iframe 访问      更新时间：2023-09-26

我有一个文件:1.html和一个iframe。
我想从iframe访问一个元素(比如myelement)，它存在于1.html(在iframe之外)。我该怎么做呢?
I tried: 

top.getElementById("myelement")
top.document.getElementById("myelement")  
parent.getElementById("myelement")
parent.document.getElementById("myelement")

但它没有工作!!

iframe和父文档之间的通信对于跨源资源是不可能的。只有当iframe和包含页面来自相同的主机，端口和协议时，它才会工作-例如http://example.com:80/1.html和http://example.com:80/2.html

对于跨源资源，您可以使用window.postMessage在两者之间进行通信，但这只有在浏览器支持该方法并且您可以控制这两个资源时才有用。

编辑-假设两个资源来自同一来源

在iframe中，window。Parent引用父文档的全局对象，而不是文档对象本身。我相信你需要使用parent.document.getElementById

假设同源策略没有问题，您可以使用parent.document访问元素，并对它们进行操作。

这里是Demo，这里是外部框架源，这里是iframe源。

parent.document不工作

对于跨域资源，您可以使用window。postMessage在两者之间进行通信，但这只有在浏览器支持该方法并且您可以控制这两个资源时才有用。

不能在iframe和父文档之间进行通信对于跨域资源

这在很多方面都是错误的，我甚至不知道从哪里开始。当然，跨域请求和算法交换有很长的历史，现在都有很好的文档和工作，一个人可以通过JQuery启动json请求甚至简单的xmlhttp请求，例如，你甚至可以加载整个。js文件并将它们注入到你的代码中——在远程源中注入代码当然需要一个合适的接口;一个人可以通过与负责人沟通来实现这样的事情，只要友好地问他们，如果你的项目有意义，有用处，也许他们会合作。

要回答这个问题:访问整个文档将需要事先传输它——出于这个目的，我建议使用XML，因为dom树和XML几乎可以互换。通过.get()加载树。ajax(用于远程主机)，将其附加到this并像您想要的那样访问它…听起来很容易，如果你有一些经验，这是很容易的。如果你曾经在同一个句子中再次看到"跨域"answers"不可能"，你可能会忽略海报-有很多人不知道他们在说什么;-)

相关文章：