BOM 的核心对象是 window,它表示浏览器的一个实例。
一、window 对象
1. 窗口位置
IE、Safari、Opera 和 Chrome 都提供了 screenLeft 和 screenTop 属性,分别用于表示窗口相对于屏幕左边和上边的位置。
Firefox 则在 screenX 和 screenY 属性中提供相同的窗口位置信息,Safari 和 Chrome 也同时支持这两个属性。
2. 窗口大小
IE9+、Firefox、Safari、Opera 和 Chrome 均为此提供了4个属性:innerWidth、innerHeight、outerWidth、outerHeight。
outerWidth、outerHeight 返回浏览器窗口本身的尺寸。innerWidth、innerHeight 表示页面视图区的大小(减去边框宽度)。在 Chrome 中,这4个属性返回相同的值,即视口大小而非浏览器窗口大小。
在 IE、Firefox、Safari、Opera 和 Chrome 中,document.documentElement.clientWidth 和document.documentElement.clientHeight 中保存了页面视口的信息。
3. 导航和打开窗口
window.open(),这个方法会返回一个指向新窗口的引用。
4. 间歇调用和超时调用
超时调用需要使用 window 对象的 setTimeout() 方法,它接收两个参数:要执行的代码和以毫秒表示的时间(即在执行代码前需要等待多少毫秒)。调用 setTimeout() 之后,该方法会返回一个数值 ID,表示超时调用。要取消尚未执行的超时调用计划,可以调用 clearTimeout() 方法并将相应的超时调用 ID 作为参数传递给它。
间歇调用与超时调用类似,只不过它会按照指定的时间间隔重复执行代码,直至间歇调用被取消或者页面被卸载。设置间歇调用的方法是 setInterval(),它接收的参数与 setTimeout() 相同。要取消尚未执行的间歇调用,可以使用 clearInterval() 方法并传入相应的间歇调用 ID。
一般认为,使用超时调用来模拟间歇调用的是一种最佳模式。在开发环境下,很少使用真正的间歇调用,原因是后一个间歇调用可能会在前一个间歇调用结束之前启动。最好不要使用间歇调用。
5. 系统对话框
alert()、confirm()、prompt()
二、location 对象
location 是最有用的 BOM 对象之一,它提供了与当前窗口中加载的文档有关的信息,还提供了一些导航功能。它既是 window 对象的属性,也是 document 对象的属性;换句话说,window.location 和 document.location 引用的是同一个对象。
location的所有属性:hash、host、hostname、href、pathname、port、protocol、search。
位置操作
assign() 方法。location.assign("http://www.wrox.com");
如果是将 location.href 或 window.location 设置为一个 URL 值,也会以该值调用 assign() 方法。例如,下列两行代码与显式调用 assign() 方法效果完全一样。
location.href = "http://www.wrox.com";
window.location = "http://www.wrox.com";
最常用的是 location.href 。
replace() 方法、reload() 方法
三、navigator 对象
四、screen 对象
五、history 对象
go()、back()、forward()
网友评论