BOM是浏览器对象模型（Browser Object Model），js认为整个浏览器可以当成一个对象window，BOM中定义了很多对象、属性和方法用于操作浏览器。

我们知道DOM是文档对象模型用于表示和操作浏览器的HTML文档部分，所以js进一步认为DOM属于浏览器对象的一部分。除此之外，window上还包括location用于获取页面url地址的位置对象、history浏览器历史记录对象、screen屏幕对象、navigator等

window 对象是BOM中所有对象的核心，是BOM中所有对象的父对象，其自身还包含一些控制窗口的函数，那我就先来看看window

window对象

window代表整个浏览器，代表全局。所以在全局声明的函数、变量都是属于window，包括变量未声明就赋值也该变量也属于window。

查看浏览器窗口尺寸（或者叫可视区域，不包括工具栏和滚动条）

//IE9以上、Chrome、Firefox、Opera 以及 Safari：
window.innerWidth;
window.innerHeight;
//IE5,6,7,8
window.documentElement.clientHeight ;
window.documentElement.clientWidth;
//IE5,6,7,8兼容性紊乱上面方法不一定行，不行可用下面这种方式
window.body.clientWidth
window.body.clientHeight

封装一个兼容所有浏览器的方法，用于获取浏览器可视宽高：

window.getInnerWH = function () {
    return {
        width: window.innerWidth || window.documentElement.clientWidth || window.body.clientWidth,
        height: window.innerHeight || window.documentElement.clientHeight || window.body.clientHeight
    }
}

查看完整窗口大小

window.outerWidth
window.outerHeight

查看元素的尺寸

var odiv = document.getElementsByTagName('div')[0]
odiv.offsetWidth
odiv.offsetHeight

offsetHeight = height + padding + border
offsetWidth = width + padding + border

查看元素的位置

odiv.offsetLeft 距离左边距离
odiv.offsetTop 距离右边距离
有定位元素，返回的是相对于最近有定位的父级元素的位置;无定位元素，返回的是相对于文档的位置

查看元素最近有定位的父级
odiv.offsetParent
返回最近有定位的父级，若无，则返回body；body的offsetParent返回null；
查看元素的几何尺寸
odiv.getBoundingClientRect()
该方法返回一个对象，对象里面有left、right、top、bottom和width、height。
兼容性很好，但返回的结果并不是实时的。
打开一个窗口

window.open(URL,name,specs,replace)

URL：表示要打开的页面地址。如果没有指定URL，打开空白窗口
name：指定target属性或窗口的名称

_blank - URL加载到一个新的窗口。这是默认
_parent - URL加载到父框架
_self - URL替换当前页面
_top - URL替换任何可加载的框架集
name - 窗口名称

specs：设置窗口规格，可选。一个逗号分隔的项目列表

height=pixels 窗口的高度。最小值为100
left=pixels 该窗口的左侧位置
location=yes|no|1|0 是否显示地址字段.默认值是yes
menubar=yes|no|1|0 是否显示菜单栏.默认值是yes
resizable=yes|no|1|0 是否可调整窗口大小.默认值是yes
scrollbars=yes|no|1|0 是否显示滚动条.默认值是yes
status=yes|no|1|0 是否要添加一个状态栏.默认值是yes
titlebar=yes|no|1|0 是否显示标题栏.被忽略，除非调用HTML应用程序或一个值得信赖的对话框.默认值是yes
toolbar=yes|no|1|0 是否显示浏览器工具栏.默认值是yes
top=pixels 窗口顶部的位置.仅限IE浏览器
width=pixels 窗口的宽度.最小.值为100
channelmode=yes|no|1|0 是否要在影院模式显示 window。默认是没有的。仅限IE浏览器
directories=yes|no|1|0 是否添加目录按钮。默认是肯定的。仅限IE浏览器
fullscreen=yes|no|1|0 浏览器是否显示全屏模式。默认是没有的。在全屏模式下的 window，还必须在影院模式。仅限IE浏览器

replace：可选，用于替换浏览历史中的当前条目
Optional.Specifies规定了装载到窗口的 URL 是在窗口的浏览历史中创建一个新条目，还是替换浏览历史中的当前条目。支持下面的值：
true - URL 替换浏览历史中的当前条目。
false - URL 在浏览历史中创建新的条目。

关闭浏览器窗口
window.close()
移动当前窗口位置

window.moveTo(x,y)
将窗口的左上角移动到指定坐标
window.moveBy(x的增量，y的增量)
用于增加
open()、close()、moveTo()的兼容性都很好

调整当前窗口的尺寸

window.resizeTo(width,height)
用于把窗口大小调整为指定的宽度和高度
window.resizeBy(宽的增量，高的增量)
用于增加宽高
但这两个方法在新版的浏览器中废除了

浏览器窗口在屏幕的位置

距离左边：window.screenX 或者 window.screenLeft
距离上边：window.screenY或者window.screenTop

让滚动条滚动

scroll(x,y)
scrollTo(x,y)
scrollBy(x,y)
x,y分别表示滚动条往x轴滚动距离和滚动条往下滚动的距离
前面个两个方法基本一样，而scrollBy()会在之前的数据基础上做累加。可以利用scrollBy实现快速阅读的功能。

查看滚动条滚动距离

window.pageXoffset
window.pageYoffset
但是低版本IE不兼容，那它用下面两组方法
document.documentElement.scrollLeft
document.documentElement.scrollTop
或者
document.body.scrollLeft
document.body.scrollTop
因为兼容性比较紊乱，采取的方法是两种方法相加，因为不可能两个同时有值
因此我们可以封装一个兼容所有浏览器的方法，用于查看滚动条滚动距离：

window.getScrollLT = function () {
  return {
    left: window.pageXOffset || document.documentElement.scrollLeft + document.body.scrollLeft,
    top: window.pageYOffset || document.documentElement.scrollTop + document.body.scrollTo
  }
}

弹窗

js中有三种弹窗：警告框、确认框、提示框
window.alert("sometext")
当警告框出现后，用户需要点击确定按钮才能继续进行操作。
window.confirm("sometext")
确认框通常用于验证是否接受用户操作。
当确认卡弹出时，用户可以点击 "确认" 或者 "取消" 来确定用户操作;当你点击 "确认", 返回 true，如果点击 "取消", 返回 false。
window.prompt("sometext","defaultvalue")
当提示框出现后，用户需要输入某个值，然后点击确认或取消按钮才能继续操纵。
如果用户点击确认，那么返回值为输入的值。如果用户点击取消，那么返回值为 null。

定时器方法也是定义在window上

window.clearInterval()
window.setTimeout()
window.clearInterval()
window.clearTimeout()
具体的使用可以看js定时器那块，讲得非常清楚。

location位置对象

用于获取页面的url地址
location.href 返回当前页面整个URL
location.protocol 返回web协议（http://或者https://）
location.hostname 返回web主机的域名
location.port 返回端口号
location.pathname 返回路径和文件名。
location.hash 返回一个URL的锚部分
assign() 载入一个新的文档
reload() 重新载入当前文档
replace() 用新的文档替换当前文档

history浏览器历史记录对象

history.back();
history.forword();
分别对应加载历史列表中的后一个和前一个URL
history.go() 加载 history 列表中的某个具体页面
history.length 历史记录条目数

screen屏幕对象

可用的屏幕宽度和高度
1.完整的分辨率：
screen.width
screen.height
2.去掉任务栏的可用宽和高（减去界面特性，如任务栏）
screen.availWith
screen.availHeight

navigator 对象

navigator 对象包含有关浏览器的信息
navigator.appCodeName 返回浏览器的代码名
navigator.appName 返回浏览器的名称
navigator.appVersion 返回浏览器的平台和版本信息
navigator.cookieEnabled 返回指明浏览器中是否启用 cookie 的布尔值
navigator.platform 返回运行浏览器的操作系统平台
navigator.userAgent 返回由客户机发送服务器的user-agent 头部的值

navigator.javaEnabled() 指定是否在浏览器中启用Java
navigator.taintEnabled() 规定浏览器是否启用数据污点(data tainting