offsetWidth/offsetHeight,clientWidth/clientHeight与scrollWidth/scrollHeight的区别
- offsetWidth/offsetHeight返回值包含content + padding + border,效果与e.getBoundingClientRect()相同
- clientWidth/clientHeight返回值只包含content + padding,如果有滚动条,也不包含滚动条
- scrollWidth/scrollHeight返回值包含content + padding + 溢出内容的尺寸

参考链接:https://msdn.microsoft.com/library/hh781509(v=vs.85).aspx
offsetWidth/offsetHeight,clientWidth/clientHeight与scrollWidth/scrollHeight的区别的更多相关文章
- JavaScript--clientX,clientY、pageX,pageY、offsetLeft,offsetTop/offsetWidth,offsetHeight、scrollLeft,scrollTop/scrollWidth,scrollHeight、clientHeight,clientWidth区别
/*在事件的内部console.dir(event)*/ /** * 事件对象event * clientX/clientY 获取鼠标基于浏览器窗口(可视区域的坐标位置)全兼容 * * pageX/p ...
- offsetWidth, offsetHeight, offsetLeft, offsetTop,clientWidth, clientHeight,clientX,pageX,screenX
offsetWidth: 元素在水平方向上占用的空间大小.包括元素的宽度,内边距,(可见的)垂直滚动条的宽度,左右边框的宽度. offsetHeight:元素在垂直方向上占用的空间大小,包括元素的高度 ...
- offsetWidth、clientWidth、width、scrollWidth区别及js与jQuery获取的方式
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- JS中的offsetWidth/offsetHeight/offsetTop/offsetLeft、clientWidth/clientHeight/clientTop/clientLeft、scrollWidth/scrollHeight/scrollTop/scrollLeft
这是一组非常容易弄混的参数!都是描述某个盒子元素的宽度.高度以及上或左的距离偏移量. 1. offsetWidth / offsetHeight(不包括外边距) offsetWidth:返回元素的宽度 ...
- offsetHeight, clientHeight与scrollHeight的区别
在网上搜了一下,结论非常笼统,讲IE从不讲版本,因此自己做了测试并上传结论.以下结论皆是在标准模式下测试通过的,没有测试quirk模式. clientHeight 大部分浏览器对 clientHe ...
- offsetTop,offsetHeight,clientHeight,scrollHeight,scrollTop区别
这些高度相信很多同学都搞不清楚吧.这里我通过本地测试,发现了区别. 以聊天窗口为例. 元素(class='content')高度444px,其中上下padding分别是10px,margin为0.距离 ...
- js获取浏览器基本信息:document.body.clientWidth/clientHeight/scrollWidth/scrollTop。(转)
js获取浏览器基本信息:document.body.clientWidth/clientHeight/scrollWidth/scrollTop. 分类: js.jquery.ext.js技术2011 ...
- javascript中offsetWidth、clientWidth、width、scrollWidth、clientX、screenX、offsetX、pageX
原文:https://www.cnblogs.com/ifworld/p/7605954.html 元素宽高 offsetWidth //返回元素的宽度(包括元素宽度.内边距和边框,不包括外边距) o ...
- javascript - 所有的视图属性和方法(offsetHeight、clientHeight、scrollHeight、innerHeight等)
注意:本文只简单的介绍了各个视图的属性和方法.如果想要知道兼容性或者更多,请至文章底部参考链接处. 本文内容分为五大部分: Window视图属性 innerHeight 和 innerWidth ou ...
随机推荐
- 我发起了一个 用 javascript 写一个 Office 的 开源项目 JS Office
用 js 写 Office, 说实在的, 把 现在已有的 各种 富文本编辑器 和 电子表格 js 库 收集起来 整合一下 就 差不多了 , 放到 前几天 那个 “ js 作为 一等公民 ...
- 使用composer遇到的坑
平台:Windows下cmd命令行內 問題 [Composer\Downloader\TransportException] The "https://packagist.phpcompos ...
- 用anaconda安装tensorflow
conda create -n tensorflow python=2.7 conda activate tensorflow / source activate tensorflow anacond ...
- Win10系统下Anaconda下安装多种Python函数库
建议直接安装Anaconda,这是一个包含Numpy,Pandas,Sklearn等函数库的计算机科学软件包,下面的软件可以在此环境下进行安装下载. 一.计算机视觉 1. OpenCV图像处理 在ht ...
- 从零开始编译Poco C++和VS2015环境配置
Poco C++是一个C++的开源框架,详细介绍可以问百度介绍更详细,这里我就记录下我从零编译poco-1.9.0和配置 VS2015的环境,以备不时之需. 步骤:一.安装cmake: 二.编译poc ...
- How do I improve my English speaking skills in a very short time?
You have asked some very important questions. I think the first step is to prioritize the issues: Yo ...
- 基于ssd的手势识别模型(object detection api方式)
[Tensorflow]Object Detection API-训练自己的手势识别模型 1. 安装tensorflow以及下载object detection api 1.安装tensorflow: ...
- ES timeout 的一些笔记
首先解释下Timeout的作用: 比如,一个search,可能要10分钟才能搜完,那么,es就会等10分钟,直到结果出来.然而,在某些场景下,客户是等不了10分钟的.比如,淘宝搜东西的时候,客户宁可等 ...
- Stream初步应用
一.什么是stream Stream(流)是一个来自数据源的元素队列并支持聚合操作,数据来源可以从inputstream,数组,集合中获取:聚合操作可以类似SQL语句一样的操作, 比如filter, ...
- Java Web组件Servlet、Filter、Listener
一.Servlet 类javax.servlet.http.HttpServlet; 1.是单例模式,一个web容器中只有一个实例.服务器调用它的service方法进行请求处理, service方法又 ...