参考: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. ../lib//libscsdblog.so: undefined reference to `pthread_atfork'

    代码中遇到这个问题,但是在makefile中已经添加了-lpthread. 最后发现问题时,引入库的顺序,把-lpthread放在最后就可以了.

  2. Building Maintainable Software-java篇之Separate Concerns in Modules

    Building Maintainable Software-java篇之Separate Concerns in Modules   In a system that is both complex ...

  3. char *strrchr使用

    /* 这个函数用到的少 这次用到记录一下 */ /* 函数原型: char *strrchr(const char *str, char c) * 功能: 找到字符c在字符串str中最后出现的位置,返 ...

  4. windows 下node版管理

    linux 下的node 多版本管理有nvm,windows 下同样有这样的工具gnvm 安装步骤(无node环境): 1.下载并解压缩 gnvm.exe 保存到任意文件夹,并将此文件夹加入到环境变量 ...

  5. Hibernate使用Log4j日志记录(使用properties文件)

    我们知道,Log4j和Logback框架可用于支持日志记录hibernate,使用log4j有两种执行日志记录的方法: 通过log4j.xml文件(或) 通过log4j.properties文件 在这 ...

  6. Unity3D学习笔记——NGUI使用常见问题

    一:在Scene中右键创建UI组件. 首先要确定NGUI中的红框能看见,我的就是之前无法现实红框,所以右键无法新建UI组件, 原因是:UIPanel没启用. 启用方法: 启用前和启用后NGUI界面对比 ...

  7. Unity3D学习笔记——游戏组件之Mesh(网格组件)

    Mesh:网格组件.主要用于设置外形和外表. Mesh Filter:网格过滤器.就是为游戏对象添加一个外形. 例:设置外形为Sphere  如果获取的网格拥有蒙皮信患,Unity将自动创建一个skn ...

  8. Apache thrift - 使用,内部实现及构建一个可扩展的RPC框架

    本文首先介绍了什么是Apache Thrift,接着介绍了Thrift的安装部署及如何利用Thrift来实现一个简单的RPC应用,并简单的探究了一下Thrift的内部实现原理,最后给出一个基于Thri ...

  9. 谈谈Android重打包--初语

    写在前面的话 仅以此系列献给喜欢我CSDN的小伙伴们 申明 此文禁止转载,谢谢合作 序言 在开头说这会是一个系列,那就说明我有非常多话要说.从最简单的介绍到问题的提出.解决方式的构思以及整个系统的架构 ...

  10. http 状态吗

    100:继续  客户端应当继续发送请求.客户端应当继续发送请求的剩余部分,或者如果请求已经完成,忽略这个响应. 101: 转换协议  在发送完这个响应最后的空行后,服务器将会切换到在Upgrade 消 ...