JavaScript高级程序设计16.pdf
第8章 BOM
BOM的核心对象就是window，它表示浏览器的一个实例，在浏览器中window对象有双重角色，它既是JavaScript访问浏览器的一个接口，又是规定的Global对象，因此所有在全局作用域中声明变量、函数都会是window对象的属性和方法
定义全局变量与在window对象上直接定义属性的差别是全局变量不能通过delete操作符删除，而直接在window对象上定义的属性可以
尝试访问未声明的变量会抛出错误，但通过查询window对象，可以知道某个可能未声明的变量是否存在
如果页面中包含框架，则每个框架都拥有自己的window对象，并且保存在frames集合中，可以通过数值索引（从0开始，从左到右，从上到下）或者框架名称来访问相应的window对象，每个window对象都有一个name对象，包含框架的名称
top对象始终指向最高（最外）层的框架，也就是浏览器窗口
parent对象始终指向当前框架的直接上层，在没有框架的情况下，parent等于top等于window
window.frames[0]
window.frames["topFrame"]
top.frames[0]
top.frames["topFrame"]
frames[0]
frames["topFrame"]
与框架有关的最有一个对象是self，它始终指向window，它们可以互换使用，引入它的目的只是为了与top parent对象有个对应
窗口位置
用来确定和修改窗口位置
IE、Safari、Opera和Chrome提供screenLeft和ScreenTop属性，表示窗口相对与屏幕左边和上边的位置
FireFox则是使用screenX和screenY
跨浏览器取得窗口位置
var leftPos=(typeof window.screenLeft=="number") ? window.screenLeft : window.screenX;
var topPos=(typeof window.screenTop=="number") ? window.screenTop : window.screenY;
由于各浏览器厂商对窗口位置的定义不同，在跨浏览器条件下无法取得窗口左边和上边的精确位置，可以使用moveTo()和moveBy()将窗口移动到一个新的位置
它们都接收2个参数moveTo()接收新位置的X和Y坐标值，moveBy()接收在水平和垂直方向上移动的像素数
注意：这两个方法可能会被浏览器禁用，另外它们不适用框架，只能对最外层的window对象使用
窗口大小
跨浏览器确定窗口大小不是一件简单的事情
IE9+、Firefox、Safari、Opera和Chrome为此提供了4个属性：innerWidth、innerHeight、outerWidth和outerHeight
IE9+、Safari和Firefox中outerWidth和outerHeight返回浏览器窗口本身的尺寸
Opera中outerWidth和outerHeight表示页面视图容器（单个标签页对应的浏览器窗口）的大小，而innerWidth和innerHeight表示页面视图区的大小（减去边框宽度）
在Chrome中innerWidth、innerHeight、outerWidth和outerHeight返回相同的值，即视口的大小而非浏览器窗口大小
在IE、Firefox、Safari、Opera和Chrome中，document.documentElement.clientWidth和document.documentElement.clientHeight保存了页面的视口信息，在IE6中，这些属性必须在标准模式下才有效，如果是混杂模式就必须通过document.body.clientWidth和document.body.clientHeight取得相同的信息，混杂模式下的Chrome对于以上两种方法都可以取得视口大小，虽然无法确定浏览器本身的大小，但却可以取得页面视口的大小
var pageWidth=window.innerWidth,
pageHeight=window.innerHeight;
if (typeof pageWidth !="number"){
if (document.compatMode == "CSS1Compat"){
pageWidth=document.documentElement.clientWidth;
pageHeight=document.documentElement.clientHeight;
}
else{
pageWidth=document.body.clientWidth;
pageHeight=document.body.clientHeight;
}
}
resizeTo()和resizeBy()方法可以调整浏览器窗口的大小，都接收2个参数，它们与移动窗口位置的方法类似，也可能被浏览器禁用，在Opera和IE7+默认就是禁用的，并且同样不适用与框架，只对最外层window对象使用
