先分别介绍以下，以下资料来自MDN

HTMLElement.offsetHeight 是一个只读属性，它返回该元素的像素高度，高度包含该元素的垂直内边距和边框，且是一个整数。

Element.clientHeight 是一个只读属性，它返回该元素的像素高度，高度包含该元素的垂直内边距和边框，且是一个整数。

Element.scrollHeight 是一个只读属性，是一个元素内容高度的度量，包括由于溢出导致的视图中不可见内容

style.height

clientHeight

offsetHeight

scrollHeight

所属对象

Object

Element

HTMLElement

Element

获取高度

内联样式高度

元素高度+内边距

元素高度+内边距+边框+滚动条

元素高度+内边距+伪元素

不包含滚动条

不包含伪元素

出现滚动条

可见部分高度

元素所有部分

读写属性

读写

只读

只读

只读

#本文有写的不好或不对的地方还请各位指出，一起学习！#

浅谈style.height、clientHeight、offsetHeight、scrollHeight的更多相关文章

  1. clientHeight & offsetHeight & scrollHeight

    clientHeight & offsetHeight & scrollHeight scrollWidth/scrollHeight,offsetWidth/offsetHeight ...

  2. style.height、offsetHeight、clientHeight、scrollHeight的差别

    style.height 包含元素的滚动栏,不包含边框 clientHeight 不包含元素的滚动栏和边框 offsetHeight 包含元素的滚动栏和边框 scrollHeight offsetHe ...

  3. JavaScript获取浏览器高度和宽度值(documentElement,clientHeight,offsetHeight,scrollHeight,scrollTop,offsetParent,offsetY,innerHeight)

    IE中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.d ...

  4. 关于body/documentElement ---->clientHeight, offsetHeight, scrollHeight

    http://blog.csdn.net/woxueliuyun/article/details/8638427 http://blog.sina.com.cn/s/blog_9dd702d50101 ...

  5. clientHeight,offsetHeight,scrollHeight迷一样的三个值

    https://blog.csdn.net/qq_39083004/article/details/78498178 https://www.imooc.com/article/17571  推荐 o ...

  6. 浅谈style.,currentStyle,getComputedStyle,getAttribute

    xxx为属性. ele为元素. 1.style.是针对于样式 在前面的一篇博客中我也有说到,ele.style.xxx; 通常用于赋值,赋值也是针对于行内样式,用它来取值的话,它只能取到内联样式. 今 ...

  7. clientHeight ,offsetHeight,style.height,scrollHeight有区别与联系

    style.height 包括 元素的滚动条,不包括边框clientHeight 不包括元素的滚动条和边框,只有在没有元素的滚动条的情况下,style.height相等于clientHeightoff ...

  8. 浅谈FileReader

    FileReader 对象允许Web应用程序异步读取存储在用户计算机上的文件(或原始数据缓冲区)的内容,使用 File 或 Blob 对象指定要读取的文件或数据. 了解https://develope ...

  9. height、clientHeight、scrollHeight、offsetHeight区别

    转自 http://www.cnblogs.com/yuteng/articles/1894578.html 我们来实现test中的onclick事件    function justAtest()  ...

随机推荐

  1. 沉淀，再出发：百度地图api的使用浅思

    沉淀,再出发:百度地图api的使用浅思 一.前言   百度地图想必大家都使用过,但是看到别人使用百度地图的API时候是不是一头雾水呢,其实真正明白了其中的意义就像是调用豆瓣电影api的接口一样的简单, ...

  2. ZT --- extern "C"用法详解 2010-08-21 19:14:12

    extern "C"用法详解 2010-08-21 19:14:12 分类: C/C++ 1.前言: 时常在cpp的代码之中看到这样的代码: #ifdef __cplusplus ...

  3. fzu_oop_east 第二次作业

    这次有四题: 题目1:(这题本身没难度,就是听说格式比较坑,好像) 代码: #include<iostream> #include<cstdio> using namespac ...

  4. java继承-重写-super实例补充

    方法重写: 是指子类根据需要父类继承来的方法进行改写,是多态机制的前奏. 重写注意点: 1.重写方法必须和被重写方法具有相同的方法名,参数列表和返回值. 2.重写方法方法不能使用比被重写方法更严格的访 ...

  5. js调用echarts getImage方法 将图表转换为img

    function chart(opt,id,chartName){//配置option的方法 var chartName = echarts.init(document.getElementById( ...

  6. 图文助你打开MS SQL Serever的ldf和mdf文件

    第一步:在C盘下找到”program files”双击打开 第二步:打开Microsoft SQL Server 第三步:选择MSSQL.1打开DATA文件 第四步:将你的ldf文件和mdf文件复制到 ...

  7. disconf实践（一）Ubuntu16.04部署disconf

    在企业中,随着公司业务的扩张,用户量的增大,单一节点应用无法支撑正常的业务逻辑,比较常见的现象是访问速度变慢,甚至超时,严重时可能会造成系统宕机.为了尽量减少宕机的风险,单一节点系统需要进行水平扩展, ...

  8. web测试－－测试点

    转载自:51Testing 首先,查找需求说明.网站设计等相关文档,分析测试需求,制定测试计划,确定测试范围和测试策略,一般包括以下几个部分:功能性测试:界面测试:性能测试:数据库测试:安全性测试:兼 ...

  9. trunc（）

    select to_char(sysdate, 'yyyy-mm-dd hh24:mi:ss'), to_char(trunc(sysdate), 'yyyy-mm-dd hh24:mi:ss') f ...

  10. C3P0连接池的配置与使用

    1.下载c3p0-0.9.1.2.jar 下载地址:http://download.csdn.net/detail/chunxiaqiudong5/9661922 2.添加配置文件c3p0-confi ...