BOM浏览器对象模型

BOM的构成

1、js访问浏览器的一个接口
2、是一个全局对象，定义全局作用域中的变量
3、调用的时候可以省略window

窗口加载事件

让js可以现在任意位置

window.onload=function(){}  //只能写一次
window.addEventListener("load",function(){
});  //没有限制
document.addEventListener("DOMContentLoad",function(){
});   //出触发时，仅当DOM加载完成时 不包括样式 图片 flash

调整窗口大小事件
窗口大小发生变化时触发这个事件

window.onresize=function(){}
window.addEventListener("resize",function(){
});

js执行机制

js是单线程 ，同一时间只能做一件事
同步 前一个任务结束后再执行后一个任务，程序执行顺序和任务排列顺序一致
异步 同时可以执行多个任务
同步任务在主线程上执行会形成一个执行栈
异步任务 异步任务一般有普通事件（如click resize）资源加载（如 load error）定时器（setInterval setTimeout）

lacation对象

URL 统一资源定位符
protocol://host[:port]/path[?query]#fragment
http://www.baidu.com/index/index.html?name=andy&age=18#link
protocol:通信协议 常用http
host：主机（域名）www.baidu.com
port:端口号
path： 路径
query 参数以键值对形式
fragment： 片段#后面常见于瞄点
location对象的属性
location.href 获取或者设置整个url
location.host 返回主机域名
location.port 返回端口号 未写返回空字符串
lacation.pathname 返回路径
location.search 返回参数
location.hash 返回片段
location对象的方法
location.assign()跟herf一样可以跳转页面
location.replace() 替换当前页面
location.reload 重新加载此也页面 相当于刷新
######history对象
back（）可以后退功能
forword（）前进功能
go（参数）前进后退功能参数是1前进一个页面 -1后退

offset属性

offset属性	作用 （1、2经常用于获取元素的位置哦😀）
element.Parentoffset	返回该元素带有定位的父级元素，如果父级没定位返回body’
element.offsetTop	返回元素相对于带有定位父元素上方的偏移
element.offsetLeft	返回元素相对于带有定位父元素左边框的偏移
element.offsetWidth	返回自身包括padding、边框、内容区的宽度，返回值不带单位
element.offsetHeight	返回自身包括padding、边框、内容区的宽度，返回值不带单位

可视区client

client属性	作用（3、4经常用于获取元素的大小哦🤩）
element.clientTop	返回元素上边框大小
element.clientLeft	返回元素左边框的大小
element.clientWidth	返回自身包括padding、内容区的宽度，不含边框，返回数值不带单位
element.clientHeight	返回自身包括padding、内容区的宽度，不含边框，返回数值不带单位

元素滚动scroll系列

scroll属性	作用（1、2经常用于获取滚动距离哦😊）
element.scrollTop	返回滚动条也就是被卷去的上侧（拉上去）的距离
element.scrollLeft	返回滚动条也就是被卷去的左侧（拉过来）的距离
element.scrollWidth	返回自身实际宽度，不含边框，返回值不带单位
element.scrollHeight	返回自身实际宽度，不含边框，返回值不带单位

！！！最后不要忘了这个
window.pageXOffset 获得页面滚动距离