父窗体与子窗体之间的通信
在之前文章讲解windows程序设计过程中，我们曾描述了windows程序窗口之间通信与控制实现方法与过程，如窗体之间参数传递等。本文主要从Web程序开发前端JavaScript脚本语言角度对窗体之间的通信及控制进行说明。
window对象
window对象是是BOM中其他所有对象的父对象，其很多属性本身就是它的子对象。通俗理解当浏览器中每打开一个窗口就会创建一个window对象的实例。JavaScript程序语言可以通过该实例实现对窗体进行控制。window对象基本属性描述如下图：
window对象常用属性
window对象常用属性描述如上图，其中与窗口参数传递与控制相关属性主要包括parent属性、opener属性及closed属性等。各属性描述如下：
1、parent属性
该属性是指包含当前窗口的父窗口，此处包含多用在框架结构中，框架页面是构成框架的各个子页面的parent。
2、opener属性
opener属性主要针对使用open方法打开的窗口，被打开的窗口即为子窗口，其父亲窗口为opener。
3、closed属性
该属性主要用于判断一个窗口是否被关闭，如被关闭则返回true逻辑值。
4、screen属性
该属性主要是指与终端浏览器尺寸相关值，主要包括屏幕的宽度、高度等。
以上给出了window对象基本属性，除以上基本属性之外，JavaScript还提供了window对象常用操作方法，方法描述如下：
window对象常用方法
window对象常用方法描述如上图所示，其中与窗口打开相关函数主要包括open方法、close方法等。说明如下：
1、open()方法
该方法主要用于实现打开一个窗口，并对打开窗口URL及相关属性进行设置。函数返回值为被打开窗口的标识。
2、close()方法
该方法主要用于实现关闭窗口，关闭窗口可以针对本身，也可以针对子窗口进行关闭操作。
父子窗口通信
web中的父子窗口主要是指打开的网页，子窗口为被打开的网页，打开者为父窗口。本文所指的父子窗口通信主要包括参数的传递与方法调用。描述如下：
父窗口与子窗口通信
父窗口与子窗口通信主要借助窗口句柄或者窗口标识实现，在获取句柄或者标识后可以使用方法与属性进行操作，下面我们对参数传递及方法调用进行实例分析与说明。
1、父传子参数传递
参数传递主要包括子窗口传父窗口或者父窗口传主窗口两类。为演示操作，我们在主窗口与子窗口中分别添加文本框用于接收数据。效果如下图所示：
参数传递测试Demo
参数传递测试Demo如上图，当父窗口点击发送数据到子窗口时，将子窗口中的文本框用于显示所发送的数据。该功能实现主要借助于主窗口在打开子窗口时获取子窗口的句柄即标识。然后根据子窗口句柄操作子窗口文本框设置值。实现核心代码如下：
父窗口传递数据给子窗口
父窗口传递数据给子窗口实现代码如上所示，主要借助childWind句柄获取子窗口的文本框设置其Value值。实现效果如下图：
父传子实现窗口
2、子传父参数传递
子传父参数传递主要借助子窗口的opener属性获取主窗口，并设置主窗口文本字段值。在子窗口中为发送数据按钮编写onclick点击处理函数，函数如下：
子传父实现代码
如上图通过opener属性获取父窗口句柄后可直接调用父窗口的getElementById获取其对话框并设置父窗口文本框的Value实现子向父亲传递参数。实现效果如下图：
子传父功能实现
3、命令操作的传递
理论上将无论父窗口还是子窗口只要获取了对方的句柄即标识之后，就可以调用对方window窗体的方法执行操作。如父窗体关闭前可直接调用子窗体的close方法先关闭子窗体。实现代码如下：
父窗体关闭子窗体
以上给出JavaScript开发过程中父窗口与子窗口通信的实现及相关案例代码演示，如需完整代码请关注并私信。在测试过程中通过父窗口获取子窗口并进行操作在Chrome浏览器下受到跨源请求规范约束无法执行代码，其他浏览器均可正常执行。
本头条号长期关注编程资讯分享；编程课程、素材、代码分享及编程培训。如果您对以上方面有兴趣或代码错误、建议与意见，可在评论区回复。更多程序设计相关教程及实例分享，期待大家关注与阅读！相关文章链接如下：
