iFrame 父子窗口通讯

今天就来说说 iFrame 的父子窗口通讯，关于 iFrame 这里就不陈述了，想要了解的盆友可以百度一下，

由于项目需要，前些天用到了个弹框框架 layer 弹出层，有很多弹出的方式，其中一种就是用到 iFrame 的,

既然是用到 iFrame 的弹框，自然是常用的有交互的菜单，自然是有两个窗口交互的机会，

所以就有了这篇博文

其实实现也挺简单的

子窗口获取父窗口的元素

语法

parent.window.document

子窗口的 parent 就是父窗口

而 parent.window.document 自然就是父窗口的 Document 对象

用法

如：获取父窗口 id = "example" 的 HTML

parent.window.document.getElementById("example").innerHTML;

父窗口获取子窗口的元素

语法

document.querySelector('子窗口 iFrame 的 id(也可以是类)').contentWindow.document.querySelector('子窗口元素的 id(也可以是类)');

用法

如：获取 id = "child" 的子窗口里面的 id = "demo" 的 HTML

document.querySelector('#child').contentWindow.document.querySelector('#demo')

至于获取到之后了，就做它该做的事情。