先来说一下BOM，什么是BOM？BOM就是浏览器对象模型，大家都知道，ECMAScript是JavaScript的核心，但如果要在WEB中使用JavaScript，那么BOM则无疑才是真正的核心，BOM,提供很多对象，用于访问浏览器功能，这些功能与任何页面内容无关，多年来，缺少事实上的规范导致BOM既有意思又有问题，因为浏览器提供商会按照各自的想法去拓展它，于是，浏览器之间共有的对象就成为了事实上的标准。
BOM的核心对象是window，它表示浏览器的一个实例。在浏览器中，window对象有双重角色，它既是通过JavaScript访问浏览器的一个接口，又是ECMAScript规定的Global对象，这意味着在网页中定义的任何一个对象、变量和函数，都以window作为其Global对象，因此有权访问parseInt()等方法。
不过，定义全局变量与在window对象上直接定义属性还是有一点差别的：全局变量不能通过delete操作符删除，而直接在window对象上定义的属性可以。
BOM的作用：控制窗口、框架、和弹出窗口，利用location对象中的页面信息、使用navigator对象了解浏览器、screen对象以及history对象等。
今天主要来介绍一下Frame框架，
如果页面中包含框架，则每个框架，都拥有自己的window对象，并且保存在frames集合中，。在frames集合中，可以通过数值索引（从0开始，从左至右，从上到下）或者框架名称来访问相应的window对象，每个window对象都有一个name属性，其中包含框架的名称。
来个例子
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>练习</title>
</head>
<frameset rows="160,*">
<frame src="frame.htm" name="topFrame">
<frameset cols="50%,50%">
<frame src="anotherframe.htm" name="leftframe">
<frame src="yetanotherframe.htm" name="rightframe">
</frameset>
</frameset>
</html>
上面代码表示，把窗口分3个框架，上面高160px，剩下的都是下面的框架，（rows=160,*）
下面的框架又分两个框架，左右各占50%,(cols="50%,50%"),
另外，每个frame框架，可以再次细分，在这就不再细分了，
下面来说一下，怎么取到每一个框架，（要在最外层的框架里写js代码哟，当然在里层框架内也可以写js代码，不过今天的代码都是在最外层框架写的）。
按上、左、右的顺序依次取：
上：window.frames[0]、window.frames["topFrame"]、top.frames.[0]、top.frames["topFrame"]、frames[0]、frames["topFrame"]。
下左：window.frames[1]、window.frames["leftframe"]、top.frames.[1]、top.frames["leftframe"]、frames[1]、frames["leftframe"]。
下左：window.frames[2]、window.frames["rightframe"]、top.frames.[2]、top.frames["rightframe"]、frames[2]、frames["rightframe"]。
注释：top对象始终指向最高（最外）层的框架，也就是浏览器窗口。使用它可以确保在一个框架中正确的访问另一个框架。因为对于在一个框架中编写的任何代码来说，其中的window对象指向的都是那个框架的特定实例，而非最高层的框架。
与top相对的另一个window对象是patent。顾名思义，parent（父）对象始终指向当前框架的直接上层框架，在某些情况下，parent有可能等于top；但在没有框架的情况下，parent一定等于top。
注意：每个框架中的window对象都是独立的，都有自己的构造函数。
原文地址：https://www.cnblogs.com/fqh123/p/10398568.html