BOM------第七周

目录

一、BOM概述

二、窗口事件

1、窗口加载事件

2、窗口大小事件

三、定时器

1、window.setTimeout（调用函数，延迟的毫秒数）定时器

2、window.setInterval（回调函数，延迟的毫秒数）定时器

四、this指向问题

五、JS执行机制

六、location对象

1、location对象属性

2、location对象的方法

七、navigator对象 

八、history对象

---

一、BOM概述

BOM 是 Browser Object Model，浏览器对象模型。
DOM 是为了操作文档出现的接口，那 BOM 顾名思义其实就是为了控制浏览器的行为而出现的接口。比如跳转到另一个页面、前进、后退等等，程序还可能需要获取屏幕的大小之类的参数。 BOM 就是为了解决这些事情出现的接口。

二、窗口事件

1、窗口加载事件

window.onload = function(  ){  }

多个window.onload事件以最后一个为准

用多个addEventlistener("load",function( ){ })不会引发冲突，load是在页面内容全部加载完成之后执行JS代码，所有都可以执行。

DomContentLoaded，是DOM加载完毕之后就可以执行。

2、窗口大小事件

window.onresize = function(  ){  }

用多个addEventlistener("resize",function( ){ })不会引发冲突，resize是在页面内容全部加载完成之后执行JS代码，所有都可以执行。

三、定时器

1、window.setTimeout（调用函数，延迟的毫秒数）定时器

调用函数可以直接写函数，也可以写函数名；

多个定时器一般都会设置标识符；

setTimeout函数也成为回调函数，是先经过时间之后才会执行函数；

停止setTimeout定时器使用  clearTimeout（定时器名字，即设定的标识符）

2、window.setInterval（回调函数，延迟的毫秒数）定时器

此定时器可以重复循环使用

停止setInterval定时器使用  clearsetInterval（定时器名字，即设定的标识符）

四、this指向问题

• this在全局作用域或者是普通函数中一般都指向window
• 方法调用中谁调用this就指向谁

五、JS执行机制

JS单线程处理任务；

新型JS出版了两种机制：

同步：前一个任务结束之后后一个任务才可以开始

异步：在同一时间内可以处理多个任务

本质区别：各个流程执行顺序不同

同步任务：都在主线程上执行，形成执行线

异步任务：一般通过回调实现（被添加到任务队列之中，但是不执行）

异步任务的3中类型：

• 普通事件，如click，resize
• 资源加载，如load，error
• 定时器（上面两种）

事件循环：主线程不断的重复获得任务，之行任务，在获取任务，再执行。

六、location对象

location属性可以用于获取或设置窗体的URL,并且可以用于解析URL。

URL即统一资源定位符，是互联网上标准资源的地址。

1、location对象属性

location对象属性	返回值
location.href	获取或设置整个URL
location.host	返回主机（域名）
location.port	返回端口号
location.pathname	返回路径
location.search	返回参数
location.hash	返回片段 #后面内容 常见于链接锚点

                     location.href  被赋值一个新的地址，会跳转到一个新的页面。

2、location对象的方法

location对象的方法	返回值
location.assign()	可以跳转页面（也称为重定向页面），可以后退
location.replace()	替换当前页面，没有记录历史，不能后退页面
location.reload（）	重新加载页面，相当于刷新按钮

七、navigator对象 

navigator对象包含有关浏览器的信息，最常用的是uesrAgent。

navigator.uesrAgent.match,可以判断用户用什么浏览器打开页面。

八、history对象

window对象为我们提供了history对象，与浏览器历史进行交互，该对象包含用户访问过的URL.

history.forward（）前进功能；history.back（）后退功能；

history.go(1)前进一步；history.go(-1)后退一步；