JS（17）BOM

1.BOM

Bom（Browser object model）即浏览器对象模型，它提供了独立于内容与浏览器窗口进行交互的对象，其核心对象是window

1.1.BOM的构成

BOM比DOM更大，它包含DOM、window、
document、localtion、navigation、screen、history

1.2.顶级对象window

-- window对象是浏览器的顶级对象、它具有双重角色。
 -- 1.它是JS访问浏览器的一个接口
 -- 2.它是一个全局对象，定义在全局作用域中的变量，函数都会变成window对象的属性和方法。

1.3.window对象的常见事件

1.3.1.页面（窗口）加载事件（2种）

	window.onload = function(){}
	or
	window.addEventListener('load',function(){})
	-- 1.2.window.onload是窗口加载事件，当文档内容完全加载完成会触发事件（包括图像、脚本文件、css文件等），就调用的处理函数。
	-- 1.3.注意：
		1.有了window.onload就可以把JS代码写到页面元素上方，因为onload是等页面内容全部加载完毕，再去执行处理函数。
		2.window.onload传统注册事件方式只能写一次，如果有多个，会以最后一个window.onload为准。
		3.使用addeventListener则没有限制
-- 2.document.addEventListener('DomContentLoaded',function(){})
DomContentLoaded事件触发时，仅当Dom加载完成，不包括样式表，图片，flash等 IE9+。

1.3.2.调整窗口大小事件

	window.onresize = function(){}
	window.addEventListener('resize',function(){})
	-- window,.onresize是调整窗口大小加载事件，当触发时就会调用的处理函数。
	注意：
		1.只要窗口大小，发生像素变化，就会触发这个事件。
		2.利用这个事件完成响应式布局，window.innerWidth当前屏幕的宽度

1.4.定时器（两种）

-- setTimeOut()
-- setInterval()
-- 开启定时器
	windiw.setTimeout(调用函数,[延迟的毫秒数])
注意：
	1.window可以省略
	2.这个调用函数可以直接写函数或函数名
	3.延迟的毫秒数省略默认是0，如果写，必须是毫秒
	4.因为定时器可能有很多，所以我们经常给定时器赋值一个标识符
-- 停止定时器
	window.clearTimeout(timeoutID)
	clearTimeout()方法取消了先前调用setTimeout()建立的定时器
注意：
	1.window可以省略
	2.里面的参数就是定时器的标识符

1.4.2.setInterval()闹钟定时器

-- 开启定时器
	window.setInterval(回调函数，[间隔的毫秒数])
	setInterval()方法重复调用一个函数，每隔这个时间，就去调用一个回调函数。
注意：
	1.window可以省略
	2.这个调用函数可以直接写函数或函数名
	3.延迟的毫秒数省略默认是0，如果写，必须是毫秒
	4.因为定时器可能有很多，所以我们经常给定时器赋值一个标识符
	5.第一次执行也是间隔毫秒数之后执行，之后每隔毫秒数就执行一次。
-- 停止定时器
	window.clearInterval(intervalID)
	claerInterval()方法取消了先前通过调用setInterval()建立的定时器

1.5.this指向问题

this的指向在函数定义的时候是确定不了的，只有函数执行的时候才能确定this到底指向谁，一般情况下this的最终指向的是那个调用它的对象
	先了解如下指向：
		1.全局作用域或者普通函数中this指向全局对象window
		2.定时器里的this指向window
		3.方法调用中谁调用this指向谁
		4.构造函数中this指向构造函数实例。