BOM
BOM，全程Browser Object Model， 也叫浏览器对象模型，它提供了很多对象，通过这些对象，可以获得浏览器的属性，并操作这些属性
BOM的总对象叫做window，其他所有对象都是它的子对象
大致包含这些：document（也就是常说的DOM，又叫文档对象），frames（框架对象），location（URL对象），history（浏览历史记录对象），navigator（浏览器对象），screen（显示器对象）
顶层对象window
- 表示一个浏览器窗口
- 提供了处理浏览器窗口的属性和方法
window有双重角色，除了提供访问浏览器属性的接口，也是JavaScript离得Global对象，因此所有在全局作用域中声明的变量，函数都回变成window对象的属性和方法
示例：
var test='aaa'
window.test; //aaawindow窗口位置
| 属性 | 说明 | 谷歌浏览器 | IE浏览器 | 火狐浏览器 |
| screenLeft | 窗口相对于屏幕左边的值 | 支持 | 支持 | |
| screenTop | 窗口相对于屏幕上边的值 | 支持 | 支持 | |
| screenX | 窗口相对于屏幕左边的值 | 支持 | ||
| screenY | 窗口相对于屏幕上边的值 | 支持 |
因此获取窗口距离屏幕左侧的值我们可以写成
var letf = (typeof window.screenLeft == 'number')?window.screenLeft : window.secrrenX操作窗口位置
- moveTo(x,y)：将窗口移动到一个新的位置。x，y表示新位置的坐标值
- moveBy(x,y)：将窗口相对于现在的位置移动到一个新位置。x，y表示水平和垂直方法上移动的像素
window窗口的大小
获取浏览器大小：outerWidth，outerHeight
获取内容区域的大小：innerWidth，innerHeight
调整窗口大小
方法有：
resizeTo(x,y)：x，y表示新窗口的宽和高
resuzeBy(x,y)：x，y表示原窗口和新窗口的高度差
窗口的打开和关闭
方法：
open：打开新窗口
close：关闭当前窗口或某个引用窗口
window.open(url,windowName,[windowFeateure])
-打开一个新窗口或查找一个已命名的窗口
- url：在新窗口中打开的url
- windowName：新窗口的名字
- windowFeateure：新窗口的设置描述字符串，可以设置新窗口的位置，尺寸，工具栏，窗口功能等
返回值是一个window对象
示例：
var mw = window.open(
'http://www.cc6608.html',
'尹dasd',
'height=500,width=600,top=50,left=50'
)
mw.resizeTo(600,600)
mw.moveTo(100,100)window.close()
关闭当前窗口或者某个引用窗口，该方法无参数，没有返回值
window.close() //关闭当前窗口
var mw = window.open(
'http://www.cc6608.html',
'尹dasd',
'height=500,width=600,top=50,left=50'
)
mw.close(); //关闭mw窗口window系统对话框
alert()，confirm()，prompt()
window定时器
setTimeout：等待一段时间后执行处理函数
示例：间隔2秒后执行函数，也可以通过clearTimeout清除定时器
var timeout=setTimeout(function () {
console.log(123);
},2000)
clearTimeout(timeout)setInterval：循环，每隔一段时间，执行处理函数
示例：每隔2秒执行一次函数，也可以手动清除循环定时器
var intervalId=setInterval(function () {
console.log(123);
},2000)
clearTimeout(intervalId)window事件
load事件：浏览器窗口加载完毕时触发
window.onload=function(){
console.log(‘onload’);
//处理函数
}resize事件：当窗口大小改变时触发
window.onresize=function(){
console.log('onresize');
//处理函数
}error事件：浏览器脚本发生错误时触发
window.onError(message,source.lineno,colno,error)
message：错误信息（字符串）
source：发生错误的脚本URL（字符串）
lineno：发送错误的行号（数字）
colno：发生错误的列号（数字）
error：Error对象
window.onError=function(msg,source,lineno,colno,error){
console.log('onError');
//处理函数
}window窗口引用
top：顶层窗口，即最上层的那个窗口
parent：父窗口
self：当前窗口，即自身
frames对象
是以集合的方式返回当前窗口中包含的框架，注意，frame是框架不可以和body共同使用
<!DOCTYPE html>
<html>
<!-- <frameset cols="25%,*,25%">
<frame src="shuxing.html">
<frame src="wendang.html">
<frame src="http://study.163.com">
</frameset> -->
<frameset rows='200,*'>
<frame src='shuxing.html' name='topFrame' />
<frameset cols='50%,50%'>
<frame src='wendang.html' name='leftFrame' />
<frame src='http://study.163.com' name='bottomFrame' />
</frameset>
</frameset>
</html>navigator
识别客户端浏览器信息
主要属性有
| 属性 | 说明 |
| appCodeName | 浏览器名称，一般都是Mozilla |
| appName | 完整的浏览器名称 |
| appVersion | 浏览器的版本号 |
| language | 用户使用的语言 |
| mineTypes | 在浏览器中注册的MiME类型数组 |
| platform | 浏览器所在的系统平台 |
| plugins | 浏览器中安装的插件信息数组 |
| userAgent | 浏览器的用户代理字符串 |
例如：
/win/i.test(navigator.platform); //判断是否是windows系统，i表示不区分大小写
/wekeit/i.test(navigator.userAgent) //判断是否是wekeit内核，i表示不区分大小写location
提供了与当前窗口中加载文档URL的有关信息
属性详解
示例URL地址：http://mooc.study.163.com:80/course?tid=2001472026#/info
整个链接，http://mooc.study.163.com:80/course?tid=2001472026#/info，我们称作，href
http，称作protocol
mooc.study.com：80，称作host，由hostname和port组成
mooc.study.com，称作hostname
80，称作port
http://mooc.study.163.com:80，称作origin，由protocol和host组成
course，到问号前面这一段称作，pathname
tid=2001472026，问号到#号之间称作search值
/info，#号后面的称作哈希值，hash
location.assign(url)
载入新的url，浏览器会记录下浏览记录，url：要跳转的地址
location.repalce(url)
载入新的url，但是浏览器不会记录浏览记录，url：要跳转的地址
location.reload(forcedReload)
重新加载页面
forcedReload：是否从服务端重新获取当前资源，boolean值，true表示从服务的重新重新获取，不传或false，可能会从浏览器缓存获取
history对象
浏览器当前窗口的浏览历史
主要属性有
| 属性 | 说明 |
| length | 用户历史会话页面的数量 |
| state | History堆栈顶部状态 |
方法
history.back()：返回会话记录的上一个页面
history.forward()：返回灰化记录记录的下一个页面
history.go(index)：表示载入会话历史中的某一个特定页面，参数index，为整型或者字符串
history.pushState(state,tittle,url)
在浏览器历史记录中添加新的记录
参数
state：一个与指定网址相关的状态对象，不需要可以传null
tittle：新页面标题，在浏览器中不起左右，一般填null
url：新的网址，必须与当前页面处在同一域，浏览器的地址栏将显示这个网址，但也没不会刷新
history.pushState({page:1},null,'/jiedian.html')
history.state={page:1}history.replaceState(state,tittle,url)
修改浏览器当前记录
参数
state：一个与指定网址相关的状态对象，不需要可以传null
tittle：新页面标题，在浏览器中不起左右，一般填null
url：新的网址，必须与当前页面处在同一域，浏览器的地址栏将显示这个网址，但也没不会刷新
history.replaceState({page:1},null,'/jiedian.html')
history.state={page:1}screen
显示器屏幕相关信息
| 属性 | 说明 | 谷歌 | 火狐 | IE |
| availHeight | 屏幕的像素高度减系统部件高度后的值 | 支持 | 支持 | 支持 |
| availWidth | 屏幕的像素宽度减系统部件宽度后的值 | 支持 | 支持 | 支持 |
| availLeft | 违背系统占用的最左侧的像素值 | 支持 | 支持 | |
| availTop | 违背系统占用的最左上方的像素值 | 支持 | 支持 | |
| colorDept | 用于表示颜色的位置 | 支持 | 支持 | 支持 |
| height | 屏幕像素的高度 | 支持 | 支持 | 支持 |
| width | 屏幕像素的宽度 | 支持 | 支持 | 支持 |
| left | 当前屏幕距离左侧的像素距离 | 支持 | ||
| top | 当前的屏幕距离顶部的像素距离 | 支持 |