clientHeight和offsetHeight
clientHeight:包括padding但不包括border、水平滚动条、margin的元素的高度。对于inline的元素这个属性一直是0,单位px,只读元素。

offsetHeight:包括padding、border、水平滚动条,但不包括margin的元素的高度。对于inline的元素这个属性一直是0,单位px,只读元素。

style.height //返回元素的高度(包括元素高度,不包括内边距、边框和外边距)
clientHeight //返回元素的高度(包括元素高度、内边距,不包括边框和外边距)
offsetHeight //返回元素的高度(包括元素高度、内边距和边框,不包括外边距)
scrollHeigh //返回元素的高度(包括元素高度、内边距和溢出尺寸,不包括边框和外边距),无溢出的情况,与clientHeight相同
scrollTop //此属性可以获取或者设置对象的最顶部到对象在当前窗口显示的范围内的顶边的距离,也就是元素滚动条被向下拉动的距离。
返回值是一个整数,单位是像素。此属性是可读写的。
offsetTop //返回元素的上外缘距离最近采用定位父元素内壁的距离,如果父元素中没有采用定位的,则是获取上外边缘距离文档内壁的距离。
所谓的定位就是position属性值为relative、absolute或者fixed。返回值是一个整数,单位是像素。此属性是只读的。
clientHeight和offsetHeight的更多相关文章
- 四种浏览器对 clientHeight、offsetHeight、scrollHeight、clientWidth、offsetWidth 和 scrollWidth 的解释差异
网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.clientHeight 网页可见区域宽:document.body.offsetWid ...
- 详解clientHeight、offsetHeight、scrollHeight
关于clientHeight.offsetHeight.scrollHeight window.screen.availWidth 返回当前屏幕宽度(空白空间) window.screen.av ...
- innerHeight,clientHeight,offsetHeight,scrollWidth等的区别和用法
要理解这几个属性,首先要搞明白body,documentElement的区别 1.body是DOM对象里的body子节点,即<body>标签2.documentElement是整个节点树的 ...
- height、clientHeight、offsetHeight、scrollHeight、height()、 innerHeight()、outerHeight()等的区别
1.height height是css属性,这个属性定义元素内容区的高度,在内容区外面可以增加内边距.边框和外边距. 当 box-sizing: content-box 时,高度应用到元素的内容框. ...
- clientHeight scrollHeight offsetHeight
<div style="height:200px;padding:10px;border:1px solid green;"></div> 对于上面的di ...
- jquery 对象的 height、innerHeight、outerHeight 的区别以及DOM 元素的 clientHeight、offsetHeight、scrollHeight、offsetTop、scrollTop
前言:jquery 对象的 height.innerHeight.outerHeight,还有 DOM 元素的 clientHeight.offsetHeight.scrollHeight.offse ...
- clientHeight , scrollHeight , offsetHeight之间的区别及兼容方案
clientHeight , scrollHeight , offsetHeight相信每个人都用过,可是每次用都要查一下到底哪个是文档大小哪个是视口大小,还有头疼的兼容问题. 先来官方的了解一下这三 ...
- scrollHeight、clientHeight、offsetHeight、scrollTop等的定义以及图解
开发中经常遇到使用scrollHeight.scrollTop.clientHeight.offsetHeight等的情况,网上有众多关于这些属性的解释,但是并不全面和直观,现在将这些属性结合图例整理 ...
- clientHeight & clientWidth & offsetHeight & offsetWidth & outerWidth & innerWidth & outerWidth & outerHeight
clientHeight & clientWidth & offsetHeight & offsetWidth MDN https://developer.mozilla.or ...
- JS clientHeight,scrollHeight,offsetHeight,scrollTop,offsetTop概念
JS滚动页面到某一位置时触发指定事件能够增强用户体验或是提高性能,其中使用最多的场景是加载更多,当鼠标滚动至页面下方时,自动加载下一页的内容.另一个常用的场景是当用户滚动至页面某一地方时,页面会给出提 ...
随机推荐
- Oracle 中的进制转换
Oracle 中的进制转换 */--> Oracle 中的进制转换 Table of Contents 1. 进制名 2. 10进制与16进制互相转换 2.1. 10进制转换为16进制 2.2. ...
- 小D课堂-SpringBoot 2.x微信支付在线教育网站项目实战_4-3.登录检验JWT实战之封装通用方法
笔记 3.登录检验JWT实战之封装通用方法 讲解:引入相关依赖并开发JWT工具类 1.加入相关依赖 <!-- JWT相关 --> <dependenc ...
- Fluent操作流程&&udf编译
Fluent 操作流程 1, 读网格模型 2, Scale修改单位 3, Check检查网格是否符合要求,最小体积不能出现负数 4, Time 选择瞬态,重力设置 5, Models-Multipha ...
- hive端建表中文注释乱码
背景:mysql编码是utf-8,mysql中建库建表中文显示都正常,但在hive窗口中建表时字段中文注释均乱码的问题. 问题:hive中建表后字段中文注释显示异常. 1. 定位 mysql 端问题 ...
- jenkins中使用shell脚本必须切换jenkins用户
https://blog.csdn.net/cdnight/article/details/81078191 安装这篇解决的 正确使用脚本的方式: 1.脚本必须使用jenknins用户,且所有命令必须 ...
- LeetCode.1185-一周中的星期几(Day of the Week)
这是小川的第415次更新,第448篇原创 看题和准备 今天介绍的是LeetCode算法题中Easy级别的第266题(顺位题号是1185).给定日期,返回该日期的星期几.输入为三个整数,分别代表日,月和 ...
- 攻防世界新手Misc writeup
ext3 在Linux,使用root账户挂载linux文件,打开后使用find *|grep flag查找到一个flag.txt,打开后是base64编码,解码获得flag. give_you_fla ...
- 华为HCNA乱学Round 1:登录权限
由于公司要用到华为设备,以前也学得比较基础就顺便补充一下.
- Hive概述
HIVE是什么 开发调试麻烦 只能用java开发 需要对hadoop的底层及api比较了解才能开发复杂代码 HQL Hive是基于Hadoop的一个数据仓库工具.可以将结构化的数据 ...
- Textual Entailment(自然语言推理-文本蕴含) - AllenNLP
自然语言推理是NLP高级别的任务之一,不过自然语言推理包含的内容比较多,机器阅读,问答系统和对话等本质上都属于自然语言推理.最近在看AllenNLP包的时候,里面有个模块:文本蕴含任务(text en ...