BOM是浏览器对象模型,提供独立于内容,和浏览器窗口进行交互的对象。它的作用就是跟浏览器做一些交互效果,比如如何进行页面后退、前进,刷新,浏览器窗口变化,滚动条滚动,以及获取客户的一些信息:浏览器版本、屏幕分辨率。
BOM的核心对象就是window,它表示浏览器的一个实例。
在浏览器中,window对象有双重角色,即是浏览器窗口的一个接口,又是全局对象,所以在全局作用域中声明的变量、函数都会变成window对象的属性和方法。
有关控制浏览器窗口的方法
- moveBy(x,y),从当前水平位置移动x个像素,垂直方向移动y个像素;
- moveTo(x,y),移动窗口左上角到相对于屏幕左上角的(x,y)位置;
- resizeBy(w,h),相对于窗口当前的大小,宽度为w,高度为h;
- resizeTo(w,h),把窗口调整为宽度为w像素,高为h像素;
- scrollTo(x,y),滚动条滚动的位置;
- scrollBy(x,y),滚动条的位置。
window.open(url),可以导航到指定的URL,也可以打开一个新的窗口。如果window.open()传递第二个参数,并且该参数是已有窗口或者框架的名称,那么就会在目标窗口加载第一个参数指定的URL。比如:
window.open(url,'aaaa')
等价于
<a href=" " target="aaaa"></a>
这时候window.open返回新窗口的引用。
window.close()
,仅用于通过window.open()
打开的窗口。
location
location的属性描述如下:
- hash,表示URL#后面的字符串
- host,服务器名称和端口号
- hostname,域名,不带端口号
- href,完整的URL
- pathname,服务器下面的文件路径
- port,端口号
- protocol,使用的协议
- search,URL的查询字符串,一般是?后面的内容
只要修改location的任何一个属性,都会导致页面重新渲染。
location.reload()
方法可以重新刷新当前页面,这个方法会根据最有效的方式刷新页面。如果想要从服务器中强制重新加载,那就传递一个参数true。
navigator
navigator对象主要是用来获取浏览器的属性,区分浏览器类型。属性很多,并且兼容性比较复杂
screen
保存的纯粹的是客户端能力的信息,也就是浏览器窗口外面的客户端显示器的信息,比如像素宽度和像素高度。
history
history对象主要用来操作浏览器URL的历史记录,可以通过参数向前、向后或者向指定URL跳转。
- history.go(),接受一个数字或者字符串作为参数,向最近的一个记录页面跳转
- history.forward(),向前跳转一个页面
- history.back,向后跳转一个页面
- history.length,获取历史记录数
这就是关于BOM信息的笔记,希望对你有所帮助!