1.clientXxx与offsetXxx与scrollXxx

1.clientXxx:

clientWidth = width+padding(left+right)

clientHeight = height+padding(top+bottom)

clientTop = border.top

clientLeft = border.left

2.offsetXxx

offsetWidth = width+padding(left+right)+border(left+right)

offsetHeight = height+padding(left+right)+border(left+right)

offsetTop = 当前元素上边框外边缘到最近有定位的元素上边框(如果没有已经定位的父级元素；body顶部)

offsetLeft = 当前元素左边框外边缘到最近有定位的元素左边框(如果没有已经定位的父级元素；body左部)

3.scrollXxx

scrollWidth = 指定标签内容层真实宽度，包括可视区和被隐藏区域的宽度；

scrollHeight = 指定标签内容层真实高度，包括可视区和被隐藏区域的高度

scrollTop = 内容层顶部到可视区顶部的距离

scrollLeft = 内容层左部到可视区左端的距离

clientXxx与offsetXxx与scrollXxx区别的更多相关文章

  1. 从输入URL到页面加载的过程？如何由一道题完善自己的前端知识体系！

    前言 见解有限,如有描述不当之处,请帮忙指出,如有错误,会及时修正. 为什么要梳理这篇文章? 最近恰好被问到这方面的问题,尝试整理后发现,这道题的覆盖面可以非常广,很适合作为一道承载知识体系的题目. ...

  2. 从输入url开始，完善前端体系架构

    原文链接: https://segmentfault.com/a/1190000013662126 从输入URL到页面加载的过程?如何由一道题完善自己的前端知识体系! javascript 前端 23 ...

  3. 勤能补挫-简单But易错的JS&CSS问题总结

    错误频率较高的JS&CSS问题 勤能补拙,不管是哪门子技术,在实践中多多总结,开发效率慢慢就会提升.本篇介绍几个经常出错的JS&CSS问题,包括事件冒泡.(使用offset.scrol ...

  4. 常见的JS和CSS问题

    事件冒泡 DOM的事件冒泡机制和WPF很相似,DOM事件机制包含冒泡和捕获两种,按照topmost element->innermost element方向传递事件被称为捕获方式,而从inner ...

  5. 理解bootstrap的列偏移offset 和 推拉push/pull的区别?

    参考: http://www.cnblogs.com/jnslove/p/5430481.html & https://blog.csdn.net/hly_coder/article/deta ...

  6. c#与java的区别

    经常有人问这种问题,用了些时间java之后,发现这俩玩意除了一小部分壳子长的还有能稍微凑合上,基本上没什么相似之处,可以说也就是马甲层面上的相似吧,还是比较短的马甲... 一般C#多用于业务系统的开发 ...

  7. jquery和Js的区别和基础操作

    jqery的语法和js的语法一样,算是把js升级了一下,这两种语法可以一起使用,只不过是用jqery更加方便 一个页面想要使用jqery的话,先要引入一下jqery包,jqery包从网上下一个就可以, ...

  8. 【原】nodejs全局安装和本地安装的区别

    来微信支付有2年多了,从2年前的互联网模式转变为O2O模式,主要的场景是跟线下的商户去打交道,不像以往的互联网模式,有产品经理提需求,我们帮忙去解决问题. 转型后是这样的,团队成员更多需要去寻找业务的 ...

  9. 探究@property申明对象属性时copy与strong的区别

    一.问题来源 一直没有搞清楚NSString.NSArray.NSDictionary--属性描述关键字copy和strong的区别,看别人的项目中属性定义有的用copy,有的用strong.自己在开 ...

随机推荐

  1. Python argparse 用法总结

    使用argparse的四个基本步骤 创建 ArgumentParser() 对象 调用 add_argument() 方法添加参数 使用 parse_args() 解析添加的参数 # example ...

  2. CyclicBarrier源码阅读

    一种允许多个线程全部等待彼此都到达某个屏障的同步机制 使用 多个线程并发执行同一个CyclicBarrier实例的await方法时,每个线程执行这个方法后,都会被暂停,只有当最后一个线程执行完awai ...

  3. 2019秋Java学期课程总结

    眨眼间,Java这门课程就快要到了尾声,这门课程主要学习到 搭建了Java的编译环境,安装eclipse软件,会用Java写一些简单的程序. 主要学习到的知识点有以下几点 1:通过写pta上的作业知道 ...

  4. Oracle数据表之间的数据同步

    保证两个数据表结构相同,如不相同只能同步相同字段; 只是思路,具体请根据需求修改. declare cursor csrn_mon is select * from table2; row_mon c ...

  5. ansible 剧本进阶 角色

    主要内容: playbook(剧本) roles 一.查看收集到的信息 ansible cache -m setup setup (需要了解的参数) ansible_all_ipv4_addresse ...

  6. Git - p4merge

    Windows 下配置 先确保 p4merge 的路径(默认:C:\Program Files\Perforce\)在环境变量中 C:\Users\zjffu>where p4merge C:\ ...

  7. Android地图开发获取sHA1值方法

    public static String sHA1(Context context) { try { PackageInfo info = context.getPackageManager().ge ...

  8. apache域名跳转

    状态码:*301: 永久重定向,域名跳转一定要用301,对搜索引擎友好的. 302:临时重定向在虚拟主机配置文件/usr/local/apache2/conf/extra/httpd-vhosts & ...

  9. fixture作用范围

    ixture里面有个scope参数可以控制fixture的作用范围:session > module > class > function fixture(scope="f ...

  10. JSP指令标签、动作标签

    JSP有三大指令: * page指令   * include指令   * taglib指令    在JSP中没有任何指令是必须的!!! 但基本上每个JSP都是使用page指令! page指令 page ...