clientWidth:可视区宽
说明:样式宽+padding
参考:js的client详解

scrollTop : 滚动条滚动距离
说明:chrome下他会以为滚动条是文档元素的,所以需要做兼容:
var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
参考:js的scroll详解

scrollHeight : 返回整个元素的高度+padding(包括子元素把父元素撑开隐蔽的地方)
参考:js的scroll详解

offsetHeight : 文档高度
说明:任何一个元素的高度+padding+border
 ie下会把整个文档可视区作为高度,建议使用document.body.offsetHeight

offsetLeft: 返回当前元素的相对水平偏移位置的偏移容器
说明:找距离定位父级(position:relative)左边的距离,如果没有定位默认是body
参考:offsetLeft与offsetTop详解

offsetParent : 返回元素的偏移容器
说明: 找有定位的父节点,没有定位默认是body,ie7以下定位在当前元素是html
参考:offsetParent详解

js的client、scroll、offset详解与兼容性的更多相关文章

  1. client/scroll/offset width/height/top/left ---记第一篇博客

    client/scroll/offset width/height/top/left (盒模型为contentBox,定位原点是元素左上角边框最外层的交点) clientWidth  width+左p ...

  2. JS中的event 对象详解

    JS中的event 对象详解   JS的event对象 Event属性和方法:1. type:事件的类型,如onlick中的click:2. srcElement/target:事件源,就是发生事件的 ...

  3. js中鼠标滚轮事件详解

    js中鼠标滚轮事件详解   (以下内容部分内容参考了http://adomas.org/javascript-mouse-wheel/ ) 之前js 仿Photoshop鼠标滚轮控制输入框取值中已使用 ...

  4. ext.js的mvc开发模式详解

    ext.js的mvc开发模式详解和环境配置 在JS的开发过程中,大规模的JS脚本难以组织和维护,这一直是困扰前端开发人员的头等问题.Extjs为了解决这种问题,在Extjs 4.x版本中引入了MVC开 ...

  5. 微信JS接口汇总及使用详解

    这篇文章主要介绍了微信JS接口汇总及使用详解,十分的全面.详尽,包含分享到朋友圈,分享给朋友,分享到QQ,拍照或从手机相册中选图,识别音频并返回识别结果,使用微信内置地图查看位置等接口,有需要的小伙伴 ...

  6. js中中括号,大括号使用详解

    js中中括号,大括号使用详解 一.总结 一句话总结:{ } 是一个对象,[ ] 是一个数组 1.js大括号{}表示什么意思? 对象 { } 大括号,表示定义一个对象,大部分情况下要有成对的属性和值,或 ...

  7. js对象浅拷贝和深拷贝详解

    js对象浅拷贝和深拷贝详解 作者:i10630226 字体:[增加 减小] 类型:转载 时间:2016-09-05我要评论 这篇文章主要为大家详细介绍了JavaScript对象的浅拷贝和深拷贝代码,具 ...

  8. amazeui中的js插件有哪些(详解功能)

    amazeui中的js插件有哪些(详解功能) 一.总结 一句话总结: 二.amazeui中的js插件有哪些 1.UI 增强 警告框Alert 按钮交互Button 折叠面板Collapse 下拉组件D ...

  9. [荐]Js apply()和call()方法详解 - http://www.w3cfuns.com/article-5596443-1-1.html

    本帖最后由 默默DE人生 于 2013-3-19 13:22 编辑 Js apply方法详解我在一开始看到javascript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文 ...

随机推荐

  1. 【IOS】ios中NSUserDefault与android中的SharedPreference用法简单对比

    以下内容为原创,欢迎转载,转载请注明 来自天天博客:http://www.cnblogs.com/tiantianbyconan/p/3405308.html 有Android开发经验的朋友对Shar ...

  2. C语言中的函数与指针

    1. 为什么需要函数? 函数就是功能的封装. 函数就是为了实现某个功能而编写的一段代码 scanf()    ,  printf() 2.函数优点: 代码更简洁 代码复用 如果业务逻辑变化,只把相应的 ...

  3. iOS 学习 - 4.存储聊天记录

    主要是用sqlite3来存储聊天记录 先导入sqlite3.dylib, 点 Add Other,同时按住shift+command+G, 在弹出的Go to the folder中输入/usr/li ...

  4. 安卓开发第一步:Android Studio安装配置

    虽然本人是JAVA开发工程师平时主要开发Web App,但因为项目需求需要开发对应的移动端.一时又找不到合适的安卓开发人员,兄弟我只好被项目经理"抓来当壮丁了".俗话说好" ...

  5. 集群服务器 时间同步 - Chrony

    greenplum,openstack等云计算项目需要集群服务器部署,服务器之间的时间需要同步,但并不是所有机器可以 直接连外网,这时可以用Chrony工具解决. 解决方法是将其中一台设为时间服务器, ...

  6. 简述MVC框架模式以及在你(Android)项目中的应用

    标题是阿里电话面试的问题,一直以为自己很清楚MVC模式,结果被问到时,居然没法将MVC和Android中各个组件对应起来,所以,面试肯定挂了,不过面试也是学习的一种方式,可以知道大公司看中什么,以及自 ...

  7. w3wp.exe(IIS ) CPU 占用 100% 的常见原因及解决办法

    对于IIS 管理员来说,经常会碰到 Web 服务器 CPU 占用 100% 的情况,以下是个人的日常工作总结和一些解决办法,主要用来剖析 w3wp.exe(IIS )  占用 CPU 100% 的一些 ...

  8. [Linux 性能检测工具]VMSTAT

    VMSTAT NAME:          Vmstat: 报告虚拟内存统计 语法 :        vmstat [-a] [-n] [-t] [-S unit] [delay [ count]] ...

  9. MySQL入门(一)

    最近一直都在搞新员工的培训材料,MySQL的培训PPT我居然写了100多页,我都佩服我自己的毅力了.不如现在把这些总结一下,慢慢写到博客里,供入门者参考. 一 关系型数据库 关系型数据库的理论提出于上 ...

  10. 深入理解JVM—JVM内存模型

    我们知道,计算机CPU和内存的交互是最频繁的,内存是我们的高速缓存区,用户磁盘和CPU的交互,而CPU运转速度越来越快,磁盘远远跟不上CPU的读写速度,才设计了内存,用户缓冲用户IO等待导致CPU的等 ...