BOM

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( 定时器的返回值 ); 停止定时器

原文地址:https://www.cnblogs.com/zlf1914/p/12801726.html