参考:http://www.cnblogs.com/woshilee/articles/1951457.html

offsetLeft 获取的是相对于父对象的左边距

left 获取或设置相对于 具有定位属性(position定义为relative)的父对象 的左边距

如果父div的position定义为relative,子div的position定义为absolute,那么子div的style.left的值是相对于父div的值。如果所有父元素,子元素都没与设定定位,那么其offsetLeft是相对于浏览器本身的左边距,如果其父元素有定位,就是离其最近的父元素的距离。

总之,要用offsetLeft和style.left的时候,还是确定好定位比较好。

这同offsetLeft是相同的,区别在于:
1. style.left 返回的是字符串,如28px,offsetLeft返回的是数值28,如果需要对取得的值进行计算,
还用offsetLeft比较方便。
2. style.left是读写的,offsetLeft是只读的,所以要改变div的位置,只能修改style.left。
3. style.left的值需要事先定义,否则取到的值为空。而且必须要定义在html里,我做过试验,如果定义在
css里,style.left的值仍然 为空,这就是我刚开始碰到的问题,总是取不到style.left的值。

offsetLeft则仍然能够取到,无需事先定义div的位置。

offsetLeft与style.left的区别的更多相关文章

  1. offsetLeft和style.left的区别

    offsetLeft 获取的是相对于父对象的左边距 left 获取或设置相对于 具有定位属性(position定义为relative)的父对象 的左边距 如果父div的position定义为relat ...

  2. DOM中offsetLeft与style.left的区别

    offsetLeft 获取的是相对于父对象的左边距 left 获取或设置相对于 具有定位属性(position定义为relative)的父对象 的左边距 如果父div的position定义为relat ...

  3. offsetleft 和 style.left 的区别

    offsetLeft 获取的是相对于父对象的左边距: left 获取或设置相对于 具有定位属性(position定义为relative)的父对象 的左边距: 如果父div的position定义为rel ...

  4. android 中theme.xml与style.xml的区别

    from://http://liangoogle.iteye.com/blog/1848448 android 中theme.xml与style.xml的区别: 相同点: 两者的定义相同. <r ...

  5. offsetLeft与style.left区别

    在javascript中经常遇到style.left和offsetLeft,那么它们有什么区别呢?今天我们来分析下 offsetLeft:获取当前元素相对于父元素的左侧偏移量,比如该元素设置为rela ...

  6. 04-offsetLeft和style.left的区别

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  7. .style, .getComputedStyle(),.currentStyle区别

    1)style只能获取行间样式(写在标签里面的):能读能写 2)currentStyle是专属ie的属性,区别他返回的是最终样式 及包括行间和外链css 3)getComputedStyle是一个可以 ...

  8. js中的offsetLeft和style.left

    (1)style.left是带单位"px"的,而offsetLeft没有单位,另外,style.left必须是内联样式,或者在JS中通过style.left赋值,否则取得的将为空字 ...

  9. js和jq中常见的各种位置距离之offsetLeft和position().left的区别(四)

    offsetLeft:元素的边框的外边缘距离与已定位的父容器(offsetparent)的左边距离(不包括元素的边框和父容器的边框).position().left:使用position().left ...

随机推荐

  1. 520. Detect Capital【easy】

    520. Detect Capital[easy] Given a word, you need to judge whether the usage of capitals in it is rig ...

  2. jstat -gcutil pid millsec

      1. jstat -gc pid 可以显示gc的信息,查看gc的次数,及时间. 其中最后五项,分别是young gc的次数,young gc的时间,full gc的次数,full gc的时间,gc ...

  3. iOS多线程(转)

    关于iOS多线程,你看我就够了 字数8596 阅读28558 评论74 喜欢313 在这篇文章中,我将为你整理一下 iOS 开发中几种多线程方案,以及其使用方法和注意事项.当然也会给出几种多线程的案例 ...

  4. Import语句

    在Java中,如果给出一个完整的限定名,包括包名.类名,那么Java编译器就可以很容易地定位到源代码或者类.Import语句就是用来提供一个合理的路径,使得编译器可以找到某个类. 例如,下面的命令行将 ...

  5. java后台如何根据表单中input的顺序获取value值

    如果java后台准备用Servlet来实现,可以直接在doPost( )或者doGet( )中使用如下语句:request.setCharacterEndoding("UTF-8" ...

  6. python 装饰器 (多个参数的函数,带参数的装饰器)

    最简单的模板是这样的 #-*-coding:utf-8-*- def outer(func): def inner(): print 'before' func() print 'after' # r ...

  7. linux下的shell 快捷键

    Ctrl+p重复上一次命令Ctrl+a跳到第一个字符前Ctrl+x同上但再按一次会从新回到原位置Ctrl+b前移一个字符不删除字符情况下Ctrl+h删除前一个字符Ctrl+u删除提示符前的所有字符Ct ...

  8. lumen 单元测试

    laravel学院:http://laravelacademy.org/post/238.html 简书:https://www.jianshu.com/p/d8b3ac2c4623 问题解决:htt ...

  9. Codeforces 460 D. Little Victor and Set

    暴力+构造 If r - l ≤ 4 we can all subsets of size not greater than k. Else, if k = 1, obviously that ans ...

  10. PowerDesigner之设置(3)——根据Name首字母生成Code

    SQL版本:2000 PowerDesigner版本:16 网上有不少介绍 PowerDesigner Name/Code自动调整 的文章,但基本如出一辙. 这里,我就介绍下如何根据输入的Name根据 ...