BOM 的核心是 window 对象,表示浏览器的实例
- 12.1.3 窗口位置与像素比
window 对象的位置可以通过不同的属性和方法来确定。现代浏览器提供了 screenLeft 和
screenTop 属性,用于表示窗口相对于屏幕左侧和顶部的位置 ,返回值的单位是 CSS 像素。
// 把窗口移动到左上角window.moveTo(0,0);
- 12.1.4 窗口大小
所有现代浏览器都支持 4 个属性:innerWidth 、 innerHeight 、 outerWidth 和 outerHeight 。 outerWidth 和 outerHeight 返回浏览器窗口自身的大小
浏览器窗口自身的精确尺寸不好确定,但可以确定页面视口的大小
使用 scroll() 、 scrollTo() 和 scrollBy() 方法滚动页面。这 3个方法都接收表示相对视口距
离的 x和 y坐标,这两个参数在前两个方法中表示要滚动到的坐标
// 相对于当前视口向下滚动 100 像素
window.scrollBy(0, 100);
- 12.2 location 对象
location 是最有用的 BOM对象之一,提供了当前窗口中加载文档的信息,以及通常的导航功能。
这个对象独特的地方在于,它既是 window 的属性,也是 document 的属性。也就是说,
window.location 和 document.location 指向同一个对象。
假 设 浏 览 器 当 前 加 载 的 URL 是 http://foouser:barpassword@www.wrox.com:80/WileyCDA/?q=javascript#contents, location 对象的内容如下表所示。
location.hash "#contents"
URL 散列值(井号后跟零或多个字符),如果没有则
为空字符串
location.host "www.wrox.com:80"
服务器名及端口号
location.hostname "www.wrox.com"
服务器名
location.href "http://www.wrox.com:80/WileyCDA/
?q=javascript#contents"
当前加载页面的完整 URL。 location 的 toString()
方法返回这个值
12.3 navigator 对象
- 12.5 history 对象
history 是 window 的属性,
所以每个 window 都有自己的 history 对象。出于安全考虑,这个对象不会暴露用户访问过的 URL,可以通过它在不知道实际 URL 的情况下前进和后退。 - 12.5.1 导航
go() 方法可以在用户历史记录中沿任何方向导航,可以前进也可以后退。这个方法只接收一个参数,
这个参数可以是一个整数,表示前进或后退多少步。负值表示在历史记录中后退// 后退一页 history.go(-1); // 前进一页 history.go(1);