day08 BOM
作者：互联网
BOM
概述
BOM是浏览器对象模型（ bowser object model ）它可以获取浏览器上的所有内容以及相关的操作
bom缺乏规范 存在共有对象解决这个问题
BOM的结构
window
概述：window是顶层对象 属于gobal（全局）对象。他是所有全局变量的父级
相关方法
打印
console.log（‘日志’） //以日志的形式打印
.error(‘错误’) //以错误的形式打印
.warn(‘警告’) //以警告的形势
.debug（‘测试’）
.info(‘信息提示’)
弹窗方法
window.alert() //弹窗提示
var isTrue = confirm('你确认要删除吗') //交互框 true确认 false取消 返回
var str = prompt('请输入') //输入框
打开关闭方法
open打开
window.open(‘url地址’，’title‘，‘target打开方式’，‘设置的参数’)
window.close()
关闭当前窗口
改变窗口位置方法
By是原本位置再加里面的参数值（类似于相对定位），To是移动到参数位置（类似于固定定位）
window.resizeBy(200,200)
window.resizeTo(200,200)
打印方法
window.print（）
聚焦和失焦的方法
focus 聚焦 blur 失焦
查找方法
window.find（） //等于浏览器ctrl+f
滚动栏位置改变
window.scrollBy( )
window.scrollTo( )
location对象（*）
属性
方法
assign跳转页面
replace替换页面
reload重新加载页面
history对象（*）
属性
length 历史页面个数
state状态存储对象
scrollRestoration 滚动栏恢复
方法
forwad前进
black后退
window.go（-1）去任意历史页面 //0表示自己，大于0前进，小于0后退
pushState 添加state的值 数据 "" 地址(会产生跨域问题)
replaceState 替换state
//pushState和replaceState会改地址，但是不会刷新，推一个历史页面到历史区，state设置进去
screen对象
属性
avaliHeight 可占用的最大高度
avaliWidth 可占用的最大宽度
avaliLeft 离屏幕左侧的距离
avaliTop 离屏幕上方的距离
navigator对象
属性
userAgent 用户浏览器设置信息
路由（拓展内容）
对于开发者来说，路由很重要
分为：前端路由和后端路由
后端路由
根据对应的接口地址来访问不同的功能 （后端路由 restful风格（接口的风格））
前端路由
根据不同的访问路径 （path）来渲染不同的内容（组件）
前端的路由主要分三种
1.页面路由 （跳转页面 刷新操作）
- location.href
- location.assign()
- location.replace()
- history.back()
- history.forward()
等这系列的操作都会导致页面进行跳转，重新加载页面（刷新）
2.hash路由 （使用hash来实现 后面必须要带上# 不会刷新页面）
通过hash的改变来改变的对应的渲染内容 （事件监听 onhashchange）
3.H5路由 （history里面state进行监听）（常用SPA （单页应用程序））
- history.pushState() 加一个历史页面（地址变了 不会刷新）
- history.replaceState() 替换历史页面 （地址变量 不会刷新）
- 也是通过事件进行监听 （onpopstate）
在对应的框架学习中 我们里面的路由的写法底层主要采用hash以及h5的方式（vue react）默认是路由模式为hash
vue中路由有几种模式 （面试题）
俩种模式（hash模式和history模式）
标签：day08,hash,state,window,BOM,页面,路由,history 来源： https://www.cnblogs.com/nihaoxiangbufuqi/p/16548604.html