凉风有信,秋月无边。
亏我思娇的情绪好比度日如年。

clientHeight、scrollHeight、offsetHeight和scrollTop之间区别

《clientHeight、scrollHeight、offsetHeight和scrollTop之间区别》正文开始,本次阅读大概7分钟。

网页可见区域高:document.body.clientHeight网页正文全文高:document.body.scrollHeight网页可见区域高(包括边线的高):document.body.offsetHeight网页被卷去的高:document.body.scrollTop屏幕分辨率高:window.screen.height

对上面信息的理解:clientHeight就是当前能看到的页面大小,它的值随着浏览器的大小变化!简单的可以理解为浏览器窗口高度-标题栏、菜单栏、工具栏、地址栏、状态栏等高度(一般是最后一个工具条以下到状态栏以上的这个区域,与页面内容无关)。不包括boder的宽度,如果区域内带有滚动条,还应该减去横向滚动条不可用的高度,正常的是17px;

scrollHeight网页的内容高度。这个值比较麻烦,IE和火狐中大小有很大不同!IE、Opera 认为 scrollHeight 是网页内容实际高度,可以小于 clientHeight。NS、FF 认为 scrollHeight 是网页内容高度,不过最小值是 clientHeight。以上都是百度百科中给出的解释,个人认为scrollHeight是网页的内容高度,即我们使用滑块所能看到的内容高度即可。

offsetHeight为模块的高度+边框的大小。IE、Opera 认为 offsetHeight = clientHeight + 滚动条 + 边框。NS、FF 认为 offsetHeight 是网页内容实际高度,可以小于 clientHeight。

scrollTop网页卷起来的高度(网页向上移动过程中,跑上去看不见的部分)。可以理解为scroll top offset是滚动条相对于其顶部的偏移。

window.screen.height是你电脑的屏幕宽度,即分辨率高。

推荐网址:http://www.cnblogs.com/yuteng/articles/1894578.html(具体代码展示)http://wenku.it168.com/d_000647093.shtml(详细解释)

赞(220)
【声明】:本博客不参与任何交易,也非中介,仅记录个人感兴趣的内容,内容均不作直接、间接、法定、约定的保证。访问本博客请务必遵守有关互联网的相关法律、规定与规则。一旦您访问本博客,即表示您已经知晓并接受了此声明通告。本博客资源仅供个人学习交流,请于下载后24小时内删除,不允许用于商业用途,否则法律问题自行承担。如果本文导致的版权问题以及内容纠错问题请联系站长QQ:1004619 | 点此给我发送邮件
本文标题:clientHeight、scrollHeight、offsetHeight和scrollTop之间区别
本文地址:https://www.1004619.com/nn/clientheightscrollheightoffset.html