三张图看懂 clientheight、offsetheight、scrollheight
clientheight
clientheigh: 内容的可视区域,不包含border。
clientheight=padding + height - 横向滚动轴高度。
The Element.clientHeight read-only property is zero for elements with
no CSS or inline layout boxes, otherwise it’s the inner height of an
element in pixels, including padding but not the horizontal scrollbar
height, border, or margin.
offsetheight
offsetheight:它包含padding、border、横向滚动轴高度。
offsetheight=padding+height+border+横向滚动轴高度
The HTMLElement.offsetHeight read-only property is the height of the element including vertical padding and borders, as an integer.
Typically, an element’s offsetHeight is a measurement in pixels of the element’s CSS height, including border, padding and the element’s horizontal scrollbar (if present, if rendered).
For the document body object, the measurement includes total linear content height instead of the element’s CSS height. Floated elements extending below other linear content are ignored.
scrollheight
scrollheight:可滚动高度,就是将滚动框拉直,不再滚动的高度,这个很好理解。scrollHeight通常用在iframe自适应内容高度的情况。
The Element.scrollHeight read-only property is a measurement of the height of an element’s content, including content not visible on the screen due to overflow.
The scrollHeight value is equal to the minimum height the element would require in order to fit all the content in the viewpoint without using a vertical scrollbar. It includes the element’s padding, but not its border or margin.
三张图看懂 clientheight、offsetheight、scrollheight的更多相关文章
- 一张图看懂开源许可协议,开源许可证GPL、BSD、MIT、Mozilla、Apache和LGPL的区别
一张图看懂开源许可协议,开源许可证GPL.BSD.MIT.Mozilla.Apache和LGPL的区别 首先借用有心人士的一张相当直观清晰的图来划分各种协议:开源许可证GPL.BSD.MIT.Mozi ...
- 一张图看懂Function和Object的关系及简述instanceof运算符
我在写一篇图解prototype和__proto__的区别时,搜资料搜到了一个有意思的现象,下面这两个运算返回的结果是一样的: Function instanceof Object;//true Ob ...
- 一张图看懂css的position里的relative和absolute的区别
position有以下属性:static.inherit.fixed.absolute.relative前三个好理解好区分:static:是默认状态,没有定位,元素出现在正常的流中(忽略 top, b ...
- 一张图看懂ANSYS17.0 流体 新功能与改进
一张图看懂ANSYS17.0 流体 新功能与改进 提交 我的留言 加载中 已留言 一张图看懂ANSYS17.0 流体 新功能与改进 原创2016-02-03ANSYS模拟在线模拟在线 模拟在线 ...
- 【转帖】自助式BI的崛起:三张图看清商业智能和大数据分析市场趋势
自助式BI的崛起:三张图看清商业智能和大数据分析市场趋势 大数据时代,商业智能和数据分析软件市场正在经历一场巨变,那些强调易用性的,人人都能使用的分析软件正在取代传统复杂的商业智能和分析软件成为市场的 ...
- FUNMVP:几张图看懂区块链技术到底是什么?(转载)
几张图看懂区块链技术到底是什么? 本文转载自:http://www.cnblogs.com/behindman/p/8873191.html “区块链”的概念可以说是异常火爆,好像互联网金融峰会上没人 ...
- 4张图看懂delphi 10生成ipa和在iPhone虚拟器上调试(教程)
4张图看懂delphi 10生成ipa和在iPhone虚拟器上调试(教程) (2016-02-01 03:21:06) 转载▼ 标签: delphi ios delphi10 教程 编程 分类: 编程 ...
- [转帖]两张图看懂GDT、GDTR、LDT、LDTR的关系
两张图看懂GDT.GDTR.LDT.LDTR的关系 2018-06-09 18:13:53 Six_666A 阅读数 2044更多 分类专栏: 深入理解linux内核 转自:http://ju.o ...
- Nodejs学习笔记(三)——一张图看懂Nodejs建站
前言:一条线,竖着放,如果做不到精进至深,那就旋转90°,至少也图个幅度宽广. 通俗解释上面的胡言乱语:还没学会爬,就学起走了?! 继上篇<Nodejs学习笔记(二)——Eclipse中运行调试 ...
随机推荐
- GIT使用—补丁与钩子
一.补丁 生成补丁 [root@localhost buding]# echo B > file;git add file;git commit -m "B" [master ...
- hadoop namenode HA集群搭建
hadoop集群搭建(namenode是单点的) http://www.cnblogs.com/kisf/p/7456290.html HA集群需要zk, zk搭建:http://www.cnblo ...
- 20145327 《Java程序设计》第二周学习总结
20145327 <Java程序设计>第二周学习总结 教材学习内容总结 JAVA类型:基本类型与类类型(也称参考类型). 基本类型分为:整数(short,int,long).字节(byte ...
- 33c3-pwn500-recurse
Recurse 好记性不如烂笔头.当时没有记录,现在趁着有时间简单写一写,为以后留备份. 这个题目当时并没有队伍做出来,赛后作者发布了题目的源码和解答.看了之后发现是一个UAF漏洞,不过漏洞很不好找. ...
- Oracle修改表结构
--添加字段 alter table [tablename] add [column name] [column data type]; --修改字段数据类型 alter table [tablen ...
- Linux crontab命令 定时任务 用法详解以及no crontab for root解决办法
最近系统服务器进行搬迁,又恰好需要使用定时任务运行程序,而我的程序主要使用PHP写的,然后总结了下定时任务的用法,但是在这里主要写的是关于crontab命令的用法,使用过程中遇到不少问题,例如no c ...
- layer弹出层的关闭及父页面的刷新问题
当在主页面执行添加或修改时,用弹出层是比较好的选择,如何关闭弹出层并对父级页面进行操作呢 首先在父级页面中打开一个添加页面(弹出层) 在添加页面的表单提交函数中添加如下代码: function for ...
- Codeforces Round #414 C. Naming Company
http://codeforces.com/contest/794/problem/C 题意: 有两个人要为公司起名字,每个人手中都有n个字符,现在要取一个n个字符长度的公司名.两人轮流取名,每次选择 ...
- UVa 10883 超级平均数(二项式系数+对数计算)
https://vjudge.net/problem/UVA-10883 题意: 给出n个数,每相邻两个数求平均数,依次类推,最后得到1个数,求该数. 思路: 演算一下可以发现最后各个数的系数就是二项 ...
- Extjs的form跨域提交文件时,无法获取返回结果
form文件表单跨域提交时,无法获取远程服务器的返回结果,form提交代码如下: form.submit({ url:'http://{remoteUrl}/hgisserver/wrds/file' ...