# JavaScript 控制指定的框架

**URL:** <https://www.isharkfly.com/t/javascript/8576>\
**Category:** 前端\
**Created:** [October 24, 2012, 12:59am UTC](https://www.isharkfly.com/t/javascript/8576 "2012-10-24T00:59:37Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![honeymoose](https://www.isharkfly.com/user_avatar/www.isharkfly.com/honeymoose/32/20796_2.png) [@honeymoose](https://www.isharkfly.com/u/honeymoose)\
**Post date:** [October 24, 2012, 12:59am UTC](https://www.isharkfly.com/t/javascript/8576/1 "2012-10-24T00:59:37Z")

</div>

Frame 对象提供诸多的属性和方法用于控制制定的框架，如更改框架是否能改变大小的标志、是否显示框架的滚动条等。

NN6+浏览器中实现的Frame 对象提供contentDocument 属性来引用与当前框架载入的文档相关的document 对象，从而获取框架中其它有用的信息。

IE5.5+和NN7 浏览器实现的Frame 对象提供contentWindow 属性来引用与当前框架产生的窗口相关的Window 对象，从而根据文档对象模型来获取document 对象及其他信息。

例如某框架集文档包含两个框架分别为“FrameName1”和“FrameName2”，而targetWin 是与“FrameName2”框架相关的Window 对象，则在“FrameName1”框架所载入的文档中  
可通过下面句子实现对targetWin 的引用：`var targetWin=parent.document.getElementById("FrameName1").contentWindow;`考察如下使用Frame 对象的属性和方法控制框架的实例。首先考虑包含左右两个框架并设定了相关参数的框架集文档：[code]

Sample Page! [/code]其中右侧框架中载入的“target.html”文档为“学籍注册程序”页面，包含文本框、单选框和下拉框等。

其程序代码如下：[code]

Sample Page! 

学籍注册程序

姓名 :

性别 : 男 女

年级 : Class 1 Class 2 Class 3 Class 4

 [/code]其中MySubmitFunc()、MyCancleFunc()事件处理程序为演示程序。框架集左侧框架载入的“leftmain.html”文档的代码如下：[code] Sample Page! 

设置右侧框架信息

框架名称 :

边框显示 : 是 否

边框颜色 : 黑色 红色 蓝色 绿色

 //设置右侧框架的元素对象信息 

姓名字段 :

性别字段 : 男 女

年级字段 : Class 1 Class 2 Class 3 Class 4

* * *

显示右侧框架信息

 [/code]在原始页面更改右侧框架及 Frame 对象的相关信息，将Frame 对象的name 属性改为“RightFrame”，frameBorder 属性改为“no”，borderColor 属性改为“red”，“姓名字段”文本框改为“YSQ”，“性别字段”单选框改为“女”，“年级字段”下拉框改为“class 3”。

然后单击“提交设置”按钮后更新右侧框架及其对应的Frame 对象相关信息。

不同的浏览器通常都会在文档内容和框架之间添加空白区域以便文档载入时其内容能自动插入到框架中。

Frame 对象提供属性marginHeight(上边界和下边界)、marginWidth(左边界和右边界)来表示该空白区域的大小。

值得注意的是，Frame 对象的属性如frameBorder、marginHeight 等都可读可写，但框架集加载后，改变这些属性的取值能够改变其具体内容，并不能改变框架中文档的外观，而需通过document 对象调用其对应的属性和方法来修改。