BOM(Browser Object Model)
BOM简介
我们在JavaScript这篇博客中讲过JavaScript分三个部分:
- ECMAScript标准(基本语法)
- DOM:Document Object Model 文档对象模型,操作页面元素的
- BOM:Browser Object Model 浏览器对象模型,操作浏览器的
前两个我们都已经学过了,今天我们进入BOM模块的学习!
- BOM就是浏览器对象模型
- BOM提供了一些独立于内容页面与浏览器窗口进行交互的对象接口
- BOM的核心是window对象,所以window一般在书写时是可以省略的.
- BOM其实也是由一系列相关的对象组成,并且每个对象都提供了很多方法和属性
BOM中的顶级对象
window对象是浏览器的顶级对象,具有双重角色
- window对象是JS访问浏览器窗口的一个接口
- window对象是一个全局对象,声明的所有的全局变量,全局方法函数最终都是window对象的属性或者方法
其他window方法
window对象 | 作用 |
---|
window.open() | 打开新窗口 |
window.close() | 关闭当前窗口 |
window.moveTo() | 移动当前窗口 |
window.resizeTo() | 调整当前窗口的尺寸 |
JavaScript Window Screen
Screen对象 | 作用 |
---|
screen.availWidth | 可用的屏幕宽度 |
screen.availHeight | 可用的屏幕高度 |
JavaScript Window Location
Location对象 | 作用 |
---|
location.href | 返回当前页面的 URL |
location.hostname | 返回 web 主机的域名 |
location.pathname | 返回当前页面的路径和文件名 |
location.port | 返回 web 主机的端口 (80 或 443) |
location.protocol | 返回所使用的 web 协议(http:// 或 https://) |
location.hash | 返回片段,URL中#后面的内容 |
location.search | 返回参数,URL参数是指URL地址中网址之后的?以后的参数 |
location.assign() | 和href一样,可以跳转页面,重定向跳转 |
location.replace() | 替换当前页面,不记录到历史中,所以不能后退页面 |
location.reload() | 重新载入页面,相当于刷新按钮,如果参数为true相当于强制刷新 |
JavaScript Window History
- window对象为浏览器提供的一个history对象来与浏览器的历史记录进行交互,为了保护用户隐私,对JavaScript 访问该对象的方法做出了限制。
History对象 | 作用 |
---|
history.back() | 与在浏览器点击后退按钮相同 |
history.forward() | 与在浏览器中点击按钮向前相同 |
history.go(参数) | 前进后退功能,参数如果是1前进一个页面,如果是-1后退一个页面,如果是N则前进或后退N个页面 |
JavaScript Window Navigator
- Navigator对象主要是记录有关浏览器的信息.
Navigator对象 | 作用 |
---|
window.navigator.userAgent | 通过userAgent可以判断用户浏览器的类型 |
window.navigator.platform | 通过platform可以判断浏览器所在的系统平台类型 |