关于BOM

BOM定义

（Browser Object Model）浏览器对象模型 与DOM相区别，
DOM是与页面的内容，BOM是与整个浏览器相关，提供了独立于内容，可以与浏览器窗口进行互动的对象结构。
BOM由多个对象组成，其中Window对象是顶层对象，剩下的对象都是Window的子对象(JS的触角更广，舞台更大)

window

window是BOM的核心对象，代表浏览器的一个实例。在浏览器中，有以下两个作用
1：javascript访问浏览器窗口的接口
2：ECMAScript规定的Global对象，即所有在全局作用域声明的变量和函数，对象都会作为window的属性和方法

window对象属性

window.innerHeight，windo.innerWidth

返回页面CSS布局占据浏览器窗口宽高

window,scrollX,window.scrollY

X:滚动条横向偏移
Y：滚动条纵向偏移

window.scrollTo

改变滚动条位置到指定坐标
window.scrollTo(0,300);//滚动条移动到300px处 *注意*如果页面在手机上 window.scroll(0,0)会隐藏手机的搜索栏 window.frames 返回一个类似数组对象，成员是页面内的所有框架。包括frame元素和iframe元素 window.frames的每个成员对应的是是框架内的窗口（框架的window对象），获取每个框架的DOM树要用window.frames[0].document`

var iframe=window.getElementsByTagName("iframe")[0];
var iframe_title=iframe.contentWindow.title//获取框架页面的标题

iframe元素遵守同源政策，即当父页面与框架页面来自同一个域名才可以用脚本通信，可以用跨域的方式来进行操作（window.postMessage方法）在iframe框架内部，使用window.parent指向父页面
在iframe中发送请求

*表示任何域下都可以接受
在父页面进行监听 message信息 从而返回相应的数据

这样我们可以定义一些接口

navigator

指向一个包含浏览器相关信息的对象

screen

包含了显示设备信息
screen.height
screen.width
即设备的分辨率

window.getComputedStyle

是一个可以获取当前元素所有最终使用CSS属性值，返回CSS样式生命对象
`var style=window.getComputedStyle("元素"，“伪类”)；·
若无伪类则不用设置
···
var div =document.getE;ementById('test');
console.log(getComputedStyle(div).width)

currentStyle是低版本的实现方案
URL的编码/解码方法

#JavaScript提供四个URL的编码/解码方法。

decodeURI()
decodeURIComponent()
encodeURI()
encodeURIComponent()
####encodeURI方法不会对下列字符编码

1. ASCII字母
2. 数字
3. ~!@#$&*()=:/,;?+'

####encodeURIComponent方法不会对下列字符编码

1. ASCII字母
2. 数字
3. ~!*()'

encodeURIComponent比encodeURI编码的范围更大  
但 如果你需要编码整个URL，然后需要使用这个URL，那么用encodeURI。
因为encodeURIComponent会把 http:// 编码成 http%3A%2F%2F 而encodeURI却不会

#alert()，prompt()，confirm()
![](https://upload-images.jianshu.io/upload_images/13167242-5a8df23c5cdc9e10.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
![](https://upload-images.jianshu.io/upload_images/13167242-6ae25badbe153ccc.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)