JS-BOM 黑马前端视频笔记

• 浏览器对象模型(Browser Object Model):提供了独立于内容而与浏览器窗口进行交互的对象。
• BOM缺乏标准。
• 获取得到的BOM元素是对象。

一、window对象

1. 是JS访问浏览器窗口的一个接口。
2. 是全局对象。

二、window对象常见事件

1. 窗口加载事件load DOMContentLoaded
   （1）传统方式：window.onload=function(){}; 只能执行一次！
   （2）方法监听注册：
   window.addEventLister('load',function(){}); 等页面内容全部加载完毕，包含页面dom元素 图片 flash css 等等。当图片很多时，使得渲染效果不好，用户体验不好。
   window.addEventLister('DOMContentLoaded',function(){}) DOMContentLoaded 是DOM 加载完毕，不包含图片 falsh css 等就可以执行 加载速度比 load更快一些
2. 调整窗口大小事件resize
   window.addEventLister('resize',function(){});
   可以用来做响应式布局，当window.innerwidth小于多少时，这个板块就消失。

三、定时器

setTimeout()	setInterval()
setTimeout(调用函数，[延迟的毫秒数]);
调用函数 直接在括号里写调用函数 ‘调用函数名()’ 调用函数名
给定时器返回标识符来区分不同的定时器
清除定时器 clearTimeout('定时器标识符')
只使用一次 网页刚打开时出现广告，几秒后结束	可多次使用 倒计时秒杀板块

四、同步与异步

• JS是单线程
• JS中顺序执行，但是有些代码运行时间长。为了解决这个问题，同时充分利用多核CPU的计算能力，H5提出了web worker 标准，允许JS创建多个线程。

• 同步：前一个任务结束后再执行下一个任务。

• 异步：任务同时进行。

• 同步任务：在主线程上执行。

• 异步任务：JS的异步是通过回调函数实现的，主要分为：
  （1）普通事件：click resize （2）资源加载：load error （3）定时器：setTiomeout() setInterval()

五、location对象

• 是window对象提供的属性，用于获取或者设置窗体的URL，还可以解析URL。
• 因为会返回对象，所以称为location对象。

1. 统一资源定位器URL Uniform Resource Locator
   
2. location属性
   

• 如何获取url参数

/ 1.先去掉？  substr('起始的位置'，截取几个字符);
var params = location.search.substr(1);
// 2. 利用=把字符串分割为数组 split('=');
var arr = params.split('=');
console.log(arr); // ["uname", "ANDY"]

3. location方法
   

六、navigator对象

• 包含浏览器的信息。

1. navigator.userAgent;返回由客户机发送服务器的user-agent头部的值。

七、history对象

• 与浏览器历史记录进行交互。
  该对象包含用户在浏览器窗口中访问过的URL。