JS加强学习-BOM学习01

BOM   浏览器对象模型

1. 定时器

1.1 设置定时器：

setTimeout(string/function,delay);间隔一定时间后执行一次，且只执行一次。

setInterval(string/function,delay);每间隔一定时间后执行一次，一直执行下去。

这两个定时器的返回值是数字类型的定时器ID。

1.2 清除定时器：

clearTimeout(定时器Id)；

clearInterval(定时器Id)。

设置定时器和清除定时器需对应设置，不建议使用与设置定时器不一致的清除方式清除定时器。

2. Offset系列

2.1 offsetWidth与offsetHeight

用来得到对象实际的宽度和高度。

2.1.1 offsetWidth和style.width的区别

style.width特点：

1 只能获取行内样式的width的值，如果该样式写没有写或者使用别的方式描述的话，便不能通过这个方法获取属性值。

2 这种方式获取到的是一个带单位的字符串。

3 即可用用来获取行内样式的属性值，也可以用来设置元素的行内样式。

4 获取到的是元素内容的width值，不包括padding和border值。

offsetWidth特点：

1 可用用来获取通过各种方式设置的属性值。

2 获取到的是一个数字，不带单位。

3 只能用来获取属性值，不能设置属性。

4 获取到的是元素实际的width，包括内部的width、元素自身的padding值和元素的border值。

2.1.2 offsetHeight与style.height的区别同上类似。

2.2 offsetLeft与offsetTop

2.2.1 offsetLeft

当前元素的左边框最外侧距离定位的父级元素的padding的最内侧的距离，如果没有定位的父级元素的话，默认以body或是文档为基准。

2.2.2 offsetTop

当前元素的上边框最外侧距离定位的父级元素的padding的最内侧的距离，如果没有定位的父级元素的话，默认以body或是文档为基准。

2.2.3 Style.left与offsetLeft的比较

offsetLeft：是以当前元素的border外侧为基准的。

style.left：是以当前元素最外面的margin为准的。