offsetLeft
offsetLeft 获取的是相对于父对象的左边距,且返回值为数字;
left 获取或设置相对于 具有定位属性(position定义为relative)的父对象 的左边距,且返回值是字符串eg:10px;
如果父div的position定义为relative,子div的position定义为absolute,那么子div的style.left的值是相对于父div的值,
这同offsetLeft是相同的,区别在于:
1. style.left 返回的是字符串,offsetLeft返回的是数值,如果需要对取得的值进行计算,还用offsetLeft比较方便。
2. style.left是读写的,offsetLeft是只读的,所以要改变div的位置,只能修改style.left。
3. style.left的值需要事先定义,否则取到的值为空。且必须要定义在html里,若定义在css里,style.left的值仍为空。offsetLeft则仍可取到,无需事先定义div的位置。
此外,还有获取坐标位置属性
1视口坐标位置:clientX、clientY;
2页面坐标位置:pageX、pageY;
3屏幕坐标位置:screenX、screenY;
offsetLeft的更多相关文章
- 通过一个实例理解 offsetLeft,offsetTop; offsetWidth , offsetHeight
obj.offsetTop 指 obj 相对于版面或由 offsetParent 属性指定的父坐标的计算上侧位置,整型 obj.offsetLeft 指 obj 相对于版面或由 offsetParen ...
- 盒子 offsetLeft、offsetTop、offsetWidth、getBoundingClientRect等属性解释
offsetLeft 获取的是忽略 margin 当前元素距离上一级父节点(有没有设置position,有的话依据父节点,没有的话依据页面最左端这时候不管滚动条移到哪) 当前元素向左的位置 记住它会将 ...
- JS:offsetWidth\offsetleft 等图文解释
网页可见区域宽: document.body.clientWidth;网页可见区域高: document.body.clientHeight;网页可见区域宽: document.body.of ...
- left和offsetLeft
left: 1.当该对象的定位position为absolute时left是相对于拥有定位属性(position的值为默认值"static"时除外)的父级对象的左边距. 例1:当父 ...
- 关于offsetWidth,offsetHeight,offsetTop,offsetLeft和二维数组的声明
offsetWidth,offsetHeight,offsetTop,offsetLeft 为只读状态,返回的值是int形式 只读形式即不能通过修改其值的大小. 想要修改某元素的这些值的大小(widt ...
- CSSOM视图模式(CSSOM View Module)相关整理:scrollWidth,scrollLeft,offsetLeft,clientX ,offsetX 定义和区别
转:http://www.zhangxinxu.com/wordpress/2011/09/cssom%E8%A7%86%E5%9B%BE%E6%A8%A1%E5%BC%8Fcssom-view-mo ...
- clientX、pageX、scrollLeft、offsetLeft、clientWidth、screen.width的用法和区别
一.定义和用法 1.event.clientX:事件对象的水平偏移量: event.clientY:事件对象的垂直偏移量: 2.event.pageX:事件对象加上滚动距离后的水平偏移量: event ...
- offsetLeft和style.left的区别
offsetLeft 获取的是相对于父对象的左边距 left 获取或设置相对于 具有定位属性(position定义为relative)的父对象 的左边距 如果父div的position定义为relat ...
- offsetLeft与offsetTop详解
offsetLeft与offsetTop使用方法一样,只是一个是找距离定位父级(position:relative)左边的距离,一个是找距离定位父级上边的距离 没有定位则找body,我们还是看看ie7 ...
- js的offsetWidth,offsetHeight,offsetLeft,offsetTop
js的offsetWidth,offsetHeight,offsetLeft,offsetTop
随机推荐
- 玩转python之每次处理一个字符
在Python中字符就是长度为1的字符串,所以可以循环遍历一个字符串,依次访问每一个字符,得到你想要的处理前提: 一个列表是个好主意,就像这样:thelist = list(thestring) 当然 ...
- Scala中的语言特性是如何实现的(3) -- Trait
我的新博客地址:http://cuipengfei.me/blog/2013/10/13/scala-trait/ 我在Coursera上跟了一门叫做Functional Programming Pr ...
- c# in deep 之对Linq表达式范围变量限制问题的一些解决办法
linq表达式的标准形式为from...where...select,其中from后面跟的就是范围变量.linq中范围变量需要是泛型的集合,假如我们想对ArrayList或Object[]进行处理,l ...
- 统计学习方法(三)——K近邻法
/*先把标题给写了.这样就能经常提醒自己*/ 1. k近邻算法 k临近算法的过程,即对一个新的样本,找到特征空间中与其最近的k个样本,这k个样本多数属于某个类,就把这个新的样本也归为这个类. 算法 ...
- js中内置有对象
statpot:使用mongo+bootstrap+highcharts做统计报表 最近做了一个统计项目,这个统计项目大致的需求是统计接口的访问速度.客户端会调用一个接口来记录接口的访问情况,我的需求 ...
- IOS7配置自动布局的约束
上一篇博客记录了怎么使用代码对视图进行约束,原文:点击打开链接 这次记录一下关于自动布局的例子, 1.创建一个Single View Application : 2.选择自动布局: 3.拖拽两个Tex ...
- 关于arcengine权限的设置
对于AE开发时候,如果调用arctoolbox中的部分功能,权限是arcview或者arceditor是无法执行的,因为权限不够. arcgis9.3的有3个权限arcview. arceditor. ...
- Gink掉过的坑(一):将CCTableView导入到lua中
环境: 系统:win7 64位 cocos2dx:cocos2d-2.1rc0-x-2.1.3 Visual Studio: 2012 由于项目是用lua写的,需要将cocos2dx中的方法导入到lu ...
- WEB安全入门
WEB安全入门 信息安全基础 信息安全目标 真实性:对信息的来源进行判断,能对伪造来源的信息予以鉴别, 就是身份认证. 保密性:保证机密信息不被窃听,盗取,或窃听者不能了解信息的真实含义. 完整性:保 ...
- (Sql Server)数据的拆分和合并
(Sql Server)数据的拆分和合并 背景: 今天遇到了数据合并和拆分的问题,尝试了几种写法.但大致可分为两类:一.原始写法.二.Sql Server 2005之后支持的写法.第一种写法复杂而且效 ...