offsetLeft与style.left区别
在javascript中经常遇到style.left和offsetLeft,那么它们有什么区别呢?今天我们来分析下
offsetLeft:获取当前元素相对于父元素的左侧偏移量,比如该元素设置为relative;left:
-10px;那么它的offsetLeft返回值是-10,而它的style.left还是为空,因为style.left只有行内设置的样式才有效;
style.left:获取当前元素的行内样式的值;
区别在于:
1. style.left 返回的是字符串,如28px,offsetLeft返回的是数值28
,如果需要对取得的值进行计算,还用offsetLeft比较方便。
2. style.left是读写的,offsetLeft是只读的,所以要改变div的位置,只能修改style.left。
3. style.left的值需要事先定义并且定义在标签的行内,否则取到的值为空。如果定义在css里,style.left的值仍然为空。offsetLeft则仍然能够取到,无需事先定义div的位置。
offsetLeft与style.left区别的更多相关文章
- offsetLeft与style.left的区别
参考:http://www.cnblogs.com/woshilee/articles/1951457.html offsetLeft 获取的是相对于父对象的左边距 left 获取或设置相对于 具有定 ...
- offsetLeft,Left,clientLeft的区别
offsetLeft,Left,clientLeft的区别 假设 obj 为某个 HTML 控件. obj.offsetTop 指 obj 相对于版面或由 offsetParent 属性指定的父坐标的 ...
- JS中offsetLeft,Left,clientLeft的区别(纯转贴)
假设 obj 为某个 HTML 控件. obj.offsetTop 指 obj 相对于版面或由 offsetParent 属性指定的父坐标的计算上侧位置,整型,单位像素. obj.offsetLeft ...
- offsetLeft和style.left的区别
offsetLeft 获取的是相对于父对象的左边距 left 获取或设置相对于 具有定位属性(position定义为relative)的父对象 的左边距 如果父div的position定义为relat ...
- DOM中offsetLeft与style.left的区别
offsetLeft 获取的是相对于父对象的左边距 left 获取或设置相对于 具有定位属性(position定义为relative)的父对象 的左边距 如果父div的position定义为relat ...
- offsetleft 和 style.left 的区别
offsetLeft 获取的是相对于父对象的左边距: left 获取或设置相对于 具有定位属性(position定义为relative)的父对象 的左边距: 如果父div的position定义为rel ...
- obj.offsetHeight与obj.style.height区别
我们都知道obj.offsetHeight与obj.style.height都可以获取obj的高度,但是在js使用中,我们通常会使用前者来获取高度,这是为什么,二者有什么样的区别呢. 1.obj.of ...
- ios UITableView的style的区别与用法,以及分割线的显示与隐藏
******************tableview style****************************************************** // tableview ...
- js中的offsetLeft和style.left
(1)style.left是带单位"px"的,而offsetLeft没有单位,另外,style.left必须是内联样式,或者在JS中通过style.left赋值,否则取得的将为空字 ...
随机推荐
- [lua]lua简介
在这篇文章中,我想向大家介绍如何进行Lua程序设计.我假设大家都学过至少一门编程语言,比如Basic或C,特别是C.因为Lua的最大用途是在宿主程序中作为脚本使用的. Lua 的语法比较简单,学习起来 ...
- [ios][swift]提示框,并自动消失
参考: 提示框:http://blog.csdn.net/gishero/article/details/43941361 提示框自动消失:http://www.cnblogs.com/yemingl ...
- meta标签部分总结
<meta>标签用于提供页面的元信息,比如针对搜索引擎和更新频度的描述和关键词.由于看到很多网页<head>里面<meta>标签的内容很多,对这些标签含义了解不太清 ...
- sdp内容解析
sdp解释 http://datatracker.ietf.org/doc/draft-nandakumar-rtcweb-sdp/?include_text=1
- hdu4933 Miaomiao's Function
水水的计数题,关键在细节. import java.math.BigInteger; import java.util.Scanner; import java.io.*; public class ...
- Inviting Friends(二分+背包)
Inviting Friends Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) To ...
- Help Me with the Game 分类: POJ 2015-06-29 16:34 17人阅读 评论(0) 收藏
Help Me with the Game Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 3706 Accepted: ...
- Eclipse编译器及一些jdk + notepad
Eclipse32位系统 http://pan.baidu.com/s/1i3eU8V7 Eclipse64位系统 http://pan.baidu.com/s/1i36ERCp jdk64位 htt ...
- CentOS搭建Redis集群
集群原理-redis-cluster架构图 架构细节: (1)所有的redis节点彼此互联(PING-PONG机制),内部使用二进制协议优化传输速度和带宽. (2)节点的fail是通过集群中超过半数的 ...
- iis 500 解决方法
1 打开运行,输入cmd进入到命令提示符窗口. 2 进入到C:\WINDOWS\Microsoft.NET\Framework\v2.0.50727 目录. 3 输入aspnet_regiis.exe ...