JavaScript初级——其他样式的相关属性

1、clientWidth

     clientHeight

—— 这两个属性可以获取元素的可见宽度和高度，都是不带px的，返回的都是一个数字，可以直接进行计算。

—— 会获取元素宽度和高度，包括内容区和内边距。

—— 这些属性都是只读的，不能修改属性。修改属性还是需要通过style属性修改。

2、offsetWidth

     offsetHeight

—— 获取元素的整个宽度和高度，包括内容区、内边距和边框。

3、offsetParent

—— 可以用来获取当前元素的定位父元素。

—— 会获取到离当前元素最近的开启了定位的祖先元素，如果所有的祖先元素都没有开启定位，则返回body。

4、offsetLeft          

—— 当前元素相对于其定位父元素的水平偏移量

     offsetTop          

—— 当前元素相对于其定位父元素的垂直偏移量

5、scrollWidth

     scrollHeight

—— 可以获取元素整个滚动区域的宽度和高度。

6、scrollLeft           

—— 可以获取水平滚动条滚动的距离。

     scrollTop           

—— 可以获取垂直滚动条关东的高度。

7、滚动条滚动到底的条件

     当满足 scrollHeight - scrollTop == clientHeight，说明垂直滚动条滚动到底了。

     当满足 scrollWidth - scrollLeft == clientWidth，说明水平滚动条滚动到底了。

8、onscroll            

—— 该事件会在元素滚动条滚动时触发。

本文到此结束，下一篇继续学习JavaScript中的事件对象的内容。