iframe中父子窗口通信

跨域的请跨下，父窗口与子窗口是无法相互访问并通信的。

非跨域的请跨下：

         

 

1、父窗口访问子窗口并操作样式

访问子窗口：

document.getElementById('iframe').contentWindow

window.frames[0] 或者 window.frames["iframe_Name"]

通过iframe的name直接获取子窗口的window对象  iframe_Name.window // window可以省略

操作样式：document.getElementById('iframe').contentWindow.document.body.background='#ffffff"

监听子窗口的加载情况:

if (window.attachEvent) {//IE10及以前版本

        document.getElementById('iframe').attachEvent('onload', function () {            

            mini.alert('IE');

        });

} else if (window.addEventListener) {//所有主流浏览器除了IE10及以前版本

        document.getElementById('iframe').addEventListener('load', function () {            

            mini.alert('ss');

        });

}

2、子窗口访问父窗口

访问父窗口：window.parent或者window.top

操作样式：window.parent.document.body.background='#ffffff'

parant.html

           

               

                Click Me!

           

       

iframe.html

       

 

温馨提示：本地文件直接打开预览，使用的是文件协议，会报如下错误(域为空)，放到服务器中预览即可。