clientHeight offsetHeight scrollHeight
2015-07-27 17:05
253 查看
参考文章:http://blog.csdn.net/magic232/article/details/20443839
clientHeight
大部分浏览器对 clientHeight 都没有什么异议,都认为是内容可视区域的高度,也就是说页面浏览器中可以看到内容的这个区域的高度,即然是指可看到内容的区域,滚动条不算在内。但要注意padding是算在内。其计算方式为clientHeight = topPadding + bottomPadding+ height - scrollbar.height。
offsetHeight
在IE6,IE7,IE8以及最新的的FF, Chrome中,在元素上都是offsetHeight = clientHeight + 滚动条 + 边框。
scrollHeight
scrollHeight是元素的padding加元素内容的高度。这个高度与滚动条无关,是内容的实际高度。计算方式 :scrollHeight = topPadding + bottomPadding + 内容 box的高度。
这里的scrollHeight的计算方式是基于内层元素的box定义的高度小于外层元素的height得到的,而内容box指的是子元素的box,包括margin,padding,border和height
最新的主流浏览器都认为scrollHeight的最小高度为clientHeight。
如果内层元素的box定义的高度大于外层元素的height,则分成下面两种情况:
一是overflow为scroll或者hidden,scrollHeight=topPaffinh+内容box的高度
二是overflow为visible或未定义overflow,可以设置三个嵌套div验证。
注:对于documentElement来说,offsetHeight为body的offsetHeight+margin,而与documentElement的clientHeight无关。
相关文章推荐
- spring依赖注入
- string类find函数返回值判定
- Java栈与堆
- 远程服务器控制台部署JBOSS项目
- UVa 1629 - Cake slicing(记忆化搜索)
- Table 'barfoo_datacenter_config.parttemplates' doesn't exist------Mysql
- html+css学习笔记
- 【BZOJ 1146】【CTSC 2008】网络管理network
- zoj2987 Misspelling
- android 画虚线、实线,画圆角矩形,一半圆角
- 从用户态的open到内核驱动实现流程
- socket与http的区别
- 如何从wireshark中获取H264码流(原创)
- 配置GITHUG&入门(2)
- Javascript验证Visa和MasterCard信用卡号的方法
- 关于寄存器ESP和EBP
- poj3278Catch That Cow(bfs)
- POJ-2456 Aggressive cows
- GDB十分钟教程
- vs2010 mvc3安装时报错