理解client、scroll和offset的差异
来源:互联网 发布:crm软件对比 编辑:程序博客网 时间:2024/04/30 06:44
client
height&width
document.body.clientWidth ==> BODY对象宽度document.body.clientHeight ==> BODY对象高度document.documentElement.clientWidth ==> 网页可见区域宽度document.documentElement.clientHeight ==> 网页可见区域高度document.getElementById("test").clientHeight ==>可见元素内容高度document.getElementById("test").clientWidth==>可见元素内容宽度
top&left
document.getElementById("test").clientTop==>元素border-top宽度
总结:clientHeight是内容可视区域的高度,包括padding和content。对于设置overflow:hidden或超出页面大小的元素内容不计算在内。
scroll
height&width
document.documentElement.scrollHeight==> 获取元素实际高度
top&left
document.documentElement.scrollLeft ==>页面滚动后的左侧位置
总结:chrome浏览器和ie有时会有兼容问题,这时用以下的方法可兼容大部分浏览器:
varscrollTop=document.body.scrollTop||document.documentElement.scrollTop
scroll即和滚动条有关,获得元素的真实大小,包括padding和content。
offset
height&width
document.documentElement.offsetHeight==> 获取元素高度,包含该元素的垂直内边距和边框,且是一个整数。
top&left
document.documentElement.offsetLeft ==>获取元素相对于offsetParent 的左侧距离
总结:offsetHeight获取元素大小(包括border)。
以后再补充。。。
0 0
- 理解client、scroll和offset的差异
- client,offset,scroll理解
- scroll、offset和client的区别
- offset,client,scroll的不同之处
- javascript的offset、client、scroll
- client offset scroll的区别
- scroll、offset和client如何区分
- javascript的offset、client、scroll使用方法详解
- offset+client+scroll
- offset、client、scroll
- offset, client, scroll
- js的element中,属性以scroll、client和offset为前缀的属性的区别
- Offset,Client,Scroll,Height,Top 一些距离参数的图示和解释
- Javascritp client,offset,scroll的区别,这里只说width和height
- js的三大家族(offset/scroll/client)和一个事件对象(event)///正则
- JavaScript中的offset、scroll、client
- html-dom (scroll offset client)
- 原生JS和JQuery下offset、client、scroll写法
- maprecuce系列(5)——map端join算法实现
- centos7下安装mysql问题
- Java finally执行问题
- C++堆和栈的比较
- JAVA LinkedList和ArrayList的使用及性能分析
- 理解client、scroll和offset的差异
- Oracle EBS 物料与客户物料查询
- 深入浅出MVC模式
- 初识.net界面程序(2)——简单计算器设计练习
- 考试倒计时
- 关于三目运算符的使用
- form-inline、form-control和form-group
- WebGIS中自定义互联网地图局部注记的一种方案
- java常用连接池一----【DBCP连接池】