同域，跨域下的iframe的通信

同域

子页面访问父页面

parent.window.parentMethod();
top.window.parentMethod();

备注：
window.parent 返回当前窗口的直接父对象
window.top 返回最顶层的窗口对象

父页面访问子页面

frames[index].window.childMethod();
frameName.window.childMethod();
frameDom.window.childMethod();

备注：
window.frames返回一个类数组对象，返回当前窗口的所有子框架元素

注意：
要确定iframe加载完成后才可以进行操作。判断iframe是否加载的方法有：

• iframe上使用onload时间
• 用document.readyState===‘complete’

跨域

post-message
window.postMessage()方法可以安全的实现跨源通信。

语法

otherWindow.postMessage(message,targetorigin,[transfer])

otherWindow
其他窗口的一个引用，比如iframe的contentWindow属性、执行window.open返回的窗口对象、或者是命名过或数值索引的window.frames

message
将要发送到其他window的数据。它将会被结构化克隆算法序列化。这意味着可以不受什么限制的将数据对象安全的传送给目标窗口而无需自己序列化

targetOrigin
通过窗口的origin属性来指定哪些窗口能接收到消息事件，其值可以是字符串"*"（表示无限制）或者一个URL。在发送消息的时候，如果目标窗口的协议、主机地址或端口这三者的任意一项不匹配targetOrigin提供的值，那些消息就不会被发送；只有三者完全匹配，消息才会发送。这个机制用来控制消息可以发送到哪些窗口；
注：如果明确知道消息应该发送到哪个窗口，那么请始终提供一个有确切值的targetOrigin，而不是。不提供确切的目标将导致数据泄露到任何对数据感兴趣的恶意站点*

transfer 可选
是一串和message同时传递的Transferable对象，这些对象的所有权将被转移给消息的接收方，而发送一方将不再保有所有权

当一个window执行postMessage之后，其他window可以监听分发的message

window.addEventListener('message',receiveMessage);
function receiveMessage(event) {}

event属性：
data
从其他window中传递过来的对象
origin
调用postMessage时消息发送方窗口的origin，由协议、域名、端口号拼接而成。
source
对发送消息的窗口对象的引用；可以用来在具有不同origin的两个窗口之间建立双向通信