[DOM基础]offsetHeight,clientHeight,scrollHeight,innerHeight,outerHeight等属性的解释

偏移量-以offset开头的

1. offsetHeight：元素在垂直方向上占用的空间大小，像素。包括元素的高度、可见的水平滚动条的高 度、上边框高度和下边框高度。
2. offsetWidth：同上，水平上占用的空间。
3. offsetLeft：元素的左外边框至包含元素的左内边框的距离
4. offsetTop：同上，上部的距离
   所有的偏移量属性都是只读的，而且每次访问都要重新计算，避免重复访问
   

客户区大小-以client开头的

1. clientHeight：内容区+内边距的高度
2. clientWidth：同上，宽度
   这两个属性也是只读和需要重新计算的。
   

滚动大小-scroll开头的

1. scrollHeight：元素内容的总高度
2. scrollWidth：总宽度
3. scrollLeft：被隐藏在内容区域左侧的像素数。通过设置这个属性可以改变滚动位置
4. scrollTop：被隐藏在内容区域上方的像素数。可以设置

获取浏览器视口高度

window.innerHeight;
document.documentElement.clientHeight
document.body.clientHeight
document.documentElement.offsetHeight // 仅在html元素无边框的情况下

元素是否滚动到底部

document.documentElement.scrollHeight - document.documentElement.scrollTop === document.documentElement.clientHeight

最后

以上就是留胡子冰淇淋为你收集整理的[DOM基础]offsetHeight,clientHeight,scrollHeight,innerHeight,outerHeight等属性的解释的全部内容，希望文章能够帮你解决[DOM基础]offsetHeight,clientHeight,scrollHeight,innerHeight,outerHeight等属性的解释所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。