跨域iframe通信跨域iframe通信

主页面与不同域名的iframe之间通信
window.postMessage()

The window.postMessage() method safely enables cross-origin communication between Window objects; e.g., between a page and a pop-up that it spawned, or between a page and an iframe embedded within it.

window.postMessage()方法安全地启用Window对象之间的跨源通信; 例如，在页面和它产生的弹出窗口之间，或者在页面和嵌入其中的iframe之间。
通常，当且仅当它们源自的页面共享相同的协议，端口号和主机（也称为“ 同源策略 ”）时，允许不同页面上的脚本相互访问。window.postMessage()提供一种受控制的机制来安全地规避这种限制（如果使用得当）。
现在我们用个小小demo来体验一下，父页面引入iframe(不同域名,下面的iframe大家也都可以引用测试)，
先发送消息到iframe，iframe接收到后在页面上显示该消息并返回#ccc色值改变父页面body背景颜色。iframe页面上有个颜色选择器，更改不同颜色值，则发送该色值到父页面，父页面接收色值后更改body的背景色。