8.0 BOM对象
Posted czhyuwj
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了8.0 BOM对象相关的知识，希望对你有一定的参考价值。
- 主要的掌握的知识结构图
- 1 Window
- 2 控制窗口、框架、弹出窗口
- 3 利用location对象中的页面信息
- 4 使用 navigator 对象了解浏览器
- 1.1 BOM的核心对象是window，它表示浏览器的一个实例。在浏览器中，window对象有双重角色，它既是通过javascript访问浏览器窗口的一个接口，又是ECMAScript规定的Global对象。
- 全局作用域
- 由于Window扮演着ECMAScript中Global 对象的角色，因此所有在全局作用域中声明的变量、函数都会变成window对象的属性和方法。
-
1 var age = 29; 2 function sayAge(){ 3 alert(this.age); 4 } 5 6 alert(window.age);//29 7 sayAge();//29 8 window.sayAge(); //29这里记住一点：
定义的全局变量 与 直接在 window上定义的变量还是有些区别的：
<1> 在window上直接定义的变量可以使用 delete删除
<2> var 声明全局变量不能使用； 这就是前面章节说的 属性描述对象中的[[Configurable]]，通过var 声明的其值默认为false
1 window.age = 20; 2 3 var color = "red"; 4 5 console.log(delete color) //false <IE9会报错 6 console.log(color); // red 7 8 console.log(delete age); //true <IE9会报错 9 console.log(window.age); //undefined
引用全局变量时，window调用未定义的属性时不会报错，而直接调用则会报错
window.age = 20; delete age; console.log(window.age); //undefind console.log(age); //"ReferenceError: age is not definede
2.1 窗口与框架的关系
1 每个框架 都拥有自己地 window对象，并保存在frames集合中。
2 在frames集合中，通过索引从0开始（从左到右 从上到下）或者框架名称来访问对应的window对象。
main.html
<script type="text/javascript"> function load(){ console.log(window.frames[0]); console.log(window.frames["topFrame"]); console.log(top.frames[0]); console.log(top.frames["topFrame"]); console.log(frames[0]); console.log(frames["topFrame"]); } </script> <frameset rows="160,*" onload="load()"> <frame src="top.html" name="topFrame"> <frameset cols="50%,50%"> <frame src="left.html" name="leftFrame"> <frame src="right.html" name="rightFrame"> </frameset>
</frameset>top.html
<!DOCTYPE> <HTML> <HEAD> </HEAD> <BODY> <ul> <li>window.frames[0]</li> <li>window.frames["topFrame"]</li> <li>top.frames[0]</li> <li>top.frames["topFrame"]</li> <li>frames[0]</li> <li>frames["topFrame"]</li> </ul> </BODY> </HTML>left.html
<!DOCTYPE> <HTML> <HEAD> </HEAD> <BODY> <ul> <li>window.frames[1]</li> <li>window.frames["leftFrame"]</li> <li>top.frames[1]</li> <li>top.frames["leftFrame"]</li> <li>frames[1]</li> <li>frames["leftFrame"]</li> </ul> </BODY> </HTML>
right.html
<!DOCTYPE> <HTML> <HEAD> </HEAD> <BODY> <ul> <li>window.frames[2]</li> <li>window.frames["rightFrame"]</li> <li>top.frames[2]</li> <li>top.frames["rightFrame"]</li> <li>frames[2]</li> <li>frames["rightFrame"]</li> </ul> </BODY> </HTML>
从上面看通过最外层访问每个框架时的方式，
top 代表的是最外层框架，也就是浏览器窗口。 使用它可以确保能够按照正确的顺序来访问每一个框架的内容。
window对象指向的都是那个框架的实例。并不是指的最外层；
与top相对的另一个window对象 parent ，顾明思意 就是指向当前窗口的父窗口，在某些情况下 top可能与 parent相等（最外层时）。但是在没有框架情况下，top一定与 parent相等；
与窗体相关的self 对象，始终指向 window对象，self 可以与window互换使用，只是为了与top， parent 相对应，没有特别含义
所有的这些对象，都是window对象的属性，可以通过 window对象来访问 window.parent 、window.top
2.1.1 窗口的位置
screenLeft screenTop screenX screenY IE Y Y Safari Y Y Y Y Opera Y Y Chrome Y Y Y Y Firefox Y Y 获取窗体位置信息
var topPos = (typeof window.screenTop=="number")?window.screenTop:window.screenY;
var leftPos = (typeof window.screenLeft=="number")?window.screenLeft:window.screenX;
在这个几个属性中，不同浏览器之间存在一些差异：
IE、Opera、Chrome、Firefox、Safari 中，screenLeft和screenTop中保存的是从屏幕左边和上边到由window对象表示的页面距离。
继续........
以上是关于8.0 BOM对象的主要内容，如果未能解决你的问题，请参考以下文章