BOM(浏览器对象模型)
BOM 的核心就是 window 对象
浏览器打开的一个页面加载window
window 是浏览器内置的一个对象,里面包含着操作浏览器的方法
获取浏览器窗口的尺寸
window.innerHeight 和 window.innerWidth属性
这两个属性分别是用来获取浏览器窗口的宽度和高度(包含滚动条的)
document.documentElement.clientWidth
document.documentElement.clientHeight
这两个属性分别是用来获取浏览器可视区的宽高(不包括滚动条)--重要
alert是在浏览器弹出一个提示框,阻止能力--调试代码
confirm是在浏览器弹出一个询问框,如果选择确定返回ture,否则false
prompt是在浏览器弹出一个输入框--很少使用
window下面子对象--location
就是专门用来存储浏览器的地址栏内的信息的
href属性:读写浏览器地址栏的内容
reload(true)方法 刷新页面,如果参数为true,通过缓存刷新。
注意: 不要写在全局,不然浏览器就会一直处在刷新状态
search属性:获取?后面的数据,包括?
地址栏是可以带数据的,通过?带上数据,多条数据通过&符号进行拼接
hash:哈希值,获取地址栏警号(#)后面的内容。影响到页面的跳转
window下面子对象--history
history.go(number) 函数 -- 前进或后退指定的页面数(负数后退,正数前进)
history.length 属性 -- history对象中缓存了多少个URL
history.back() 函数 -- 后退一页
history.forward() 函数 -- 前进一页
浏览器事件
onload事件:页面内容加载完成(DOM结构,图片.....)后触发
有了这个事件,可以将js代码放在文档任意位置,因为我都是最后执行的。(等页面结构加载完成,包括结构里面的内容)
一个页面只能有一个这个事件,多个后面的覆盖前面。
onscroll事件: 拖动浏览器的滚动条触发此事件。
注意事件的触发频率。拖动时会触发多次
onresize事件:浏览器窗口缩放所触发此事件
滚动条距离
document.documentElement.scrollTop 垂直滚动条,滚动条离顶部的距离
document.documentElement.scrollLeft 左边
定时器
setInterval(函数名称或者函数体,时间);间隔定时器(反复调用)
setTimeout(函数名称或者函数体,时间); 延时定时器,执行一次
clearInterval( 定时器的返回值 ); 停止定时器