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

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

如果父div的position定义为relative,子div的position定义为absolute,那么子div的style.left的值是相对于父div的值,
这同offsetLeft是相同的,区别在于:
1. style.left 返回的是字符串,如28px,offsetLeft返回的是数值28,如果需要对取得的值进行计算,
还用offsetLeft比较方便。
2. style.left是读写的,offsetLeft是只读的,所以要改变div的位置,只能修改style.left。
3. style.left的值需要事先定义,否则取到的值为空。而且必须要定义在html里,我做过试验,如果定义在
css里,必须用currentStyle(IE)或者getComputedStyle(火狐,谷歌)。

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

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

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

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

  2. offsetLeft与style.left的区别

    参考:http://www.cnblogs.com/woshilee/articles/1951457.html offsetLeft 获取的是相对于父对象的左边距 left 获取或设置相对于 具有定 ...

  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. 阿里云上部署 centos+nodejs+mongodb

    先执行 yum -y update nginx 安装 yum -y install nginx 设置开机启动 chkconfig nginx on nodejs 安装: yum install nod ...

  2. CAGradientLayer渐变效果

    属性 startPoint和endPoint 决定渐变方向,以单位坐标系定义.左上角{0,0},右下角{1,1} colors 渐变的颜色,是一个CGColorRef的数组. locations 定义 ...

  3. Android图表类库:WilliamChart

    WilliamChart是基于Views的Android图表类库,帮助开发者在Android应用中实现折线图.柱状图和堆叠柱状图.数值发生变化时图表也会以动画的效果发生变化. At the momen ...

  4. Android线程优先级设置方法技巧

    对于Android平台上的线程优先级设置来说可以处理很多并发线程的阻塞问题, 比如很多无关紧要的线程会占用大量的CPU时间,虽然通过了MultiThread来解决慢速I/O但是合理分配优先级对于并发编 ...

  5. iOS 滑动隐藏导航栏-三种方式

    /** 1隐藏导航栏-简单- */    self.navigationController.hidesBarsOnSwipe = YES; /** 2隐藏导航栏-不随tableView滑动消失效果 ...

  6. chrome插件——Vimium 键盘手福利

    chrome插件——Vimium 键盘手福利 金刚 chrome chrome插件 Vimium 一直希望纯键盘操作,但是在浏览网页的时候,发现还是很难做到这点的.因为网页浏览的时候会有 各种各样的内 ...

  7. 转载:设置html页面不让浏览器缓存的方法

    本文是转载文章,只是方便自己记录. 在html页面head标签之间添加以下标识可以避免大多数浏览器缓存: <meta http-equiv="Pragma" content= ...

  8. MySQL入门(一)

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

  9. 在可以调用 OLE 之前,必须将当前线程设置为单线程单元(STA)模式

    在可以调用 OLE 之前,必须将当前线程设置为单线程单元(STA)模式 转载自:http://blog.163.com/smhily_min/blog/static/75206226201092011 ...

  10. x01.os.14: 时间都去哪儿了

    时间都去哪儿了 老帕的“花儿为什么这样红”,三分钟引起六次欢呼,却败给了张碧晨.试想一下,如果是人气更高的陈冰,即使唱得和张碧晨一模一样,可能仍然不敌老帕,为什么张碧晨就能取胜呢?有这么个笑话:一人弹 ...