BOM(Browser Object Model)

BOM(Browser Object Model)

BOM简介

我们在JavaScript这篇博客中讲过JavaScript分三个部分:

1. ECMAScript标准(基本语法)
2. DOM:Document Object Model 文档对象模型,操作页面元素的
3. BOM:Browser Object Model 浏览器对象模型,操作浏览器的

前两个我们都已经学过了,今天我们进入BOM模块的学习!

• BOM就是浏览器对象模型
• BOM提供了一些独立于内容页面与浏览器窗口进行交互的对象接口
• BOM的核心是window对象,所以window一般在书写时是可以省略的.
• BOM其实也是由一系列相关的对象组成，并且每个对象都提供了很多方法和属性

BOM中的顶级对象

window对象是浏览器的顶级对象，具有双重角色

1. window对象是JS访问浏览器窗口的一个接口
2. 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可以判断浏览器所在的系统平台类型