• 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的区别的更多相关文章

  1. JavaScript--clientX,clientY、pageX,pageY、offsetLeft,offsetTop/offsetWidth,offsetHeight、scrollLeft,scrollTop/scrollWidth,scrollHeight、clientHeight,clientWidth区别

    /*在事件的内部console.dir(event)*/ /** * 事件对象event * clientX/clientY 获取鼠标基于浏览器窗口(可视区域的坐标位置)全兼容 * * pageX/p ...

  2. offsetWidth, offsetHeight, offsetLeft, offsetTop,clientWidth, clientHeight,clientX,pageX,screenX

    offsetWidth: 元素在水平方向上占用的空间大小.包括元素的宽度,内边距,(可见的)垂直滚动条的宽度,左右边框的宽度. offsetHeight:元素在垂直方向上占用的空间大小,包括元素的高度 ...

  3. offsetWidth、clientWidth、width、scrollWidth区别及js与jQuery获取的方式

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  4. JS中的offsetWidth/offsetHeight/offsetTop/offsetLeft、clientWidth/clientHeight/clientTop/clientLeft、scrollWidth/scrollHeight/scrollTop/scrollLeft

    这是一组非常容易弄混的参数!都是描述某个盒子元素的宽度.高度以及上或左的距离偏移量. 1. offsetWidth / offsetHeight(不包括外边距) offsetWidth:返回元素的宽度 ...

  5. offsetHeight, clientHeight与scrollHeight的区别

      在网上搜了一下,结论非常笼统,讲IE从不讲版本,因此自己做了测试并上传结论.以下结论皆是在标准模式下测试通过的,没有测试quirk模式. clientHeight 大部分浏览器对 clientHe ...

  6. offsetTop,offsetHeight,clientHeight,scrollHeight,scrollTop区别

    这些高度相信很多同学都搞不清楚吧.这里我通过本地测试,发现了区别. 以聊天窗口为例. 元素(class='content')高度444px,其中上下padding分别是10px,margin为0.距离 ...

  7. js获取浏览器基本信息：document.body.clientWidth/clientHeight/scrollWidth/scrollTop。（转）

    js获取浏览器基本信息:document.body.clientWidth/clientHeight/scrollWidth/scrollTop. 分类: js.jquery.ext.js技术2011 ...

  8. javascript中offsetWidth、clientWidth、width、scrollWidth、clientX、screenX、offsetX、pageX

    原文:https://www.cnblogs.com/ifworld/p/7605954.html 元素宽高 offsetWidth //返回元素的宽度(包括元素宽度.内边距和边框,不包括外边距) o ...

  9. javascript - 所有的视图属性和方法（offsetHeight、clientHeight、scrollHeight、innerHeight等）

    注意:本文只简单的介绍了各个视图的属性和方法.如果想要知道兼容性或者更多,请至文章底部参考链接处. 本文内容分为五大部分: Window视图属性 innerHeight 和 innerWidth ou ...

随机推荐

  1. C 标识符, 数据存储形式（原码,反码,补码）

    一.  标识符 第一个字母必须是英文字母或下划线 二. 数据存储形式(补码存储) 最高位是符号位 ---- 0表示整数 ; 1 表示负数 1. 正数:原码 = 反码 = 补码 例子 : (10) 原码 ...

  2. Android环境下hanlp汉字转拼音功能的使用介绍

    由于项目需要在Android手机设备上实现汉字转拼音功能(支持多音字),于是首先想到了Pinyin4j+多音字映射对照表的实现方案,并在项目中试用了一段时间,发现数据量大时,其耗时非常严重.后来寻找其 ...

  3. linux系统服务详解

    下面现介绍一下运行次序和运行级别: 一个 Linux 系统的引导过程可以分为几个阶段.我们主要看看当内核加载后的那一个阶段.你可以运行runlevel 命令来确定您的系统当前的运行级,当内核被加载并开 ...

  4. flutter mac 下安装

  5. Unity3D外包 团队更新一下UE4和Unity3D案例

    欢迎联系我们索取,谢谢! 有项目外包请联系QQ:372900288 索取案例.

  6. thinkphp框架 的 链接数据库和操作数据

    框架有时会用到数据库的内容,在"ThinkPhp框架知识"的那篇随笔中提到过,现在这篇随笔详细的描述下. 一.链接数据库 (1)找到模块文件夹中的Conf文件夹,然后进行编写con ...

  7. leetcode70 爬楼梯 Python

    组合数学Fibonacci 例3.4.1   (上楼梯问题)某人欲登上n级楼梯,若每次只能跨一级或两级,问他从地面上到第n级楼梯,共有多少种不同的方法? (解)设上到第n级楼梯的方法数为an.分类统计 ...

  8. python 开发接口（一）

    一.首先导入模块  pip install flask 二 1 import flas 2 import json import flask #1.启动一个服务 #2.接收到客户端传过来的数据 #3. ...

  9. [UE4]Spline使用注意事项

    一.如果在Character中使用Spline,则使用Add Spline Mesh Componet的时候,要注意设置Transform.Mobility为Movable 二.使用Predict P ...

  10. source insight 中文乱码解决方法

    options->preferences -> Files-> default encoding: 选择 GB2312 CP:936