• 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. PRESTO安装部署和参数说明(一)

    PRESTO部署和参数说明(一) 一,概要 在部署和使用presto的过程中,在此记录一下部署记录和使用记录以及需要注意的事项.本人使用的presto版本是0.214,3台redhat虚拟机.使用背景 ...

  2. 15.1 打开文件时的提示(不是dos格式)去掉头文件

    1.用ultraedit打开文件时,总提示不是DOS格式 2.把这个取消.dos格式只是用来在unix下读写内容的,此功能禁用即可.

  3. angular2 ngfor循环

    angular2 在组件模板中可以循环数组集合等对象,语法非常简单,如: <ng-container *ngFor="let item of model.list"> ...

  4. tomcat配置接口访问时间

    这次刚好用到,亲测可用.参照:https://www.cnblogs.com/wuxun1997/p/9068398.html 项目中有些页面时延不稳定,需要看每次接口调用时延,怎么看,有两种方法:一 ...

  5. c# 使用http摘要认证

    .net 使用http摘要认证,返回json数据 using System; using System.Collections.Generic; using System.Linq; using Sy ...

  6. IO练习

    #IO操作 import time; fileObj = open('log.txt','a'); while(True): data = input('请输入要写入的内容 : '); if data ...

  7. 黄聪：Windows2012-IIS8安装SSL证书

    开始菜单->右上角搜索按钮-> mmc 弹出窗口 关闭控制台会提示保存 打开iis新建站点,为了兼容不支持sni的浏览器,绑定默认https

  8. Delphi编译选项

    编译选项的设置,称为“开关指令”,其中大部分值为布尔类型 一.代码生成(Code generation)1.Optimization  优化代码,默认true2.Stack frames  生成过程/ ...

  9. [UE4]Grab抓取

    一.关键函数:AttachToCompoent,将要抓取的物品附加到角色手上,让物品跟随手移动,开起来就像是抓取在手里了. 二.取消模拟物理.在开启模拟物理的情况下,AttachToCompoent是 ...

  10. 离线手动部署docker镜像仓库——harbor仓库（HTTPS）

    实验环境: harbor服务器系统:CentOS Linux release 7.5.1804 (Core)harbor服务器IP:10.1.12.114harbor版本:v1.5.0docker版本 ...