在浏览器中,window对象(注意,w为小写)指当前的浏览器窗口。它也是所有对象的顶层对象。
“顶层对象”指的是最高一层的对象,所有其他对象都是它的下属。JavaScript规定,浏览器环境的所有全局变量,都是window对象的属性。
var a = 1;
window.a // 1
上面代码中,变量a是一个全局变量,但是实质上它是window对象的属性。声明一个全局变量,就是为window对象的同名属性赋值。
从语言设计的角度看,所有变量都是window对象的属性,其实不是很合理。因为window对象有自己的实体含义,不适合当作最高一层的顶层对象。这个设计失误与JavaScript语言匆忙的设计过程有关,最早的设想是语言内置的对象越少越好,这样可以提高浏览器的性能。因此,语言设计者Brendan Eich就把window对象当作顶层对象,所有未声明就赋值的变量都自动变成window对象的属性。这种设计使得编译阶段无法检测出未声明变量,但到了今天已经没有办法纠正了。
window对象的属性
(1)window对象的
window属性指向自身。
window.window === this // true
(2)window.name属性用于设置当前浏览器窗口的名字。
window.name = 'Hello World!';
console.log(window.name)
// "Hello World!"
各个浏览器对这个值的储存容量有所不同,但是一般来说,可以高达几MB。
该属性只能保存字符串,且当浏览器窗口关闭后,所保存的值就会消失。因此局限性比较大,但是与<iframe>窗口通信时,非常有用。
(3)window.location返回一个location对象,用于获取窗口当前的URL信息。它等同于document.location对象。
window.location === document.location // true
(4)
window.closed属性返回一个布尔值,表示窗口是否关闭。
window.closed // false
上面代码检查当前窗口是否关闭。这种检查意义不大,因为只要能运行代码,当前窗口肯定没有关闭。这个属性一般用来检查,使用脚本打开的新窗口是否关闭。
var popup = window.open();
if ((popup !== null) && !popup.closed) {
// 窗口仍然打开着
}
(5)window.opener属性返回打开当前窗口的父窗口。如果当前窗口没有父窗口,则返回
null。
window.open().opener === window // true
上面表达式会打开一个新窗口,然后返回
true。
通过opener属性,可以获得父窗口的的全局变量和方法,比如window.opener.propertyName和window.opener.functionName()。
(6)window.frames属性返回一个类似数组的对象,成员为页面内所有框架窗口,包括frame元素和iframe元素。window.frames[0]表示页面中第一个框架窗口。
如果iframe元素设置了id或name属性,那么就可以用属性值,引用这个iframe窗口。比如<iframe name="myIFrame">就可以用frames['myIFrame']或者frames.myIFrame来引用。
frames属性实际上是window对象的别名。
frames === window // true
因此,frames[0]也可以用window[0]表示。但是,从语义上看,frames更清晰,而且考虑到window还是全局对象,因此推荐表示多窗口时,总是使用frames[0]的写法。更多介绍请看下文的《多窗口操作》部分。
(7)window.length属性返回当前网页包含的框架总数。如果当前网页不包含frame和iframe元素,那么window.length就返回0。
window.frames.length === window.length // true
window.frames.length与
window.length应该是相等的。
(8)window.screenX和window.screenY属性,返回浏览器窗口左上角相对于当前屏幕左上角((0, 0))的水平距离和垂直距离,单位为像素。
(9)window.innerHeight和window.innerWidth属性,返回网页在当前窗口中可见部分的高度和宽度,即“视口”(viewport),单位为像素。
当用户放大网页的时候(比如将网页从100%的大小放大为200%),这两个属性会变小。因为这时网页的像素大小不变(比如宽度还是960像素),只是每个像素占据的屏幕空间变大了,因为可见部分(视口)就变小了。
注意,这两个属性值包括滚动条的高度和宽度。
(10)window.outerHeight和window.outerWidth属性返回浏览器窗口的高度和宽度,包括浏览器菜单和边框,单位为像素。
(11)window.pageXOffset属性返回页面的水平滚动距离,window.pageYOffset属性返回页面的垂直滚动距离,单位都为像素。
举例来说,如果用户向下拉动了垂直滚动条75像素,那么window.pageYOffset就是75。用户水平向右拉动水平滚动条200像素,window.pageXOffset就是200。
我的个人博客地址:http://xiuchundu.github.io/,欢迎交流
。
8723

被折叠的 条评论
为什么被折叠?



