JavaScript中style.left与offsetLeft的区别
今天在制作焦点轮播图的时候,遇到一个问题,在使用style.left获取图片的位置时,怎么也获取不到。换用offsetLeft就能够成功获取到了。虽然实现了我想要的效果,但是还是不甘心啊,没有找到原因,心里就是怪怪的,于是我翻开JavaScript高级程序设计,将style.left和offsetLeft有关的知识点都看了一下,做了如下比较。
(一)、对于style.left类属性,JavaScript高级程序是这样描述的:任何支持style特性的HTML元素在JavaScript中都有一个对应的style属性。这个style对象是CSSStyleDeclaration的实例,包含着通过HTML的style特性指定的所有样式信息,但不包含与外部样式表或嵌入样式表经层叠而来的样式(关键就在这句话!也就是说只有设置为行内样式的style属性才能被获取)。在style特性中指定的任何CSS属性都将表现为这个style对象的相应属性。
(二)、对于offsetLeft累属性:
offsetLeft:元素的左外边框至包含元素的左内边框之间的像素距离。
offsetTop:元素的上外边框至包含元素的上内边框之间的像素距离。
通过看书和今天遇到的问题,对style.left和offsetLeft做如下总结
相同点
1、style.left与offsetLeft都是相对于其父元素的值。
不同点
1、style.left返回的是字符串,带有px;offsetLeft返回的是数值。
2、style.left时可以读取的也是可以配置的;offsetLeft只能读取不能配置。
JavaScript中style.left与offsetLeft的区别的更多相关文章
- [转]javascript中style.left和offsetLeft的使用
如果父div的position定义为relative,子div的position定义为absolute,那么子div的style.left的值是相对于父div的值,这同offsetLeft是相同的,区 ...
- Javascript中style,currentStyle和getComputedStyle的区别以及获取css操作方法
style: 只能获取行内style. 调用:obj.style.属性; 兼容:都兼容 currentStyle: 可以获取该obj所有style,但只可读. 调用:obj.currentStyle[ ...
- JavaScript中const、var和let区别浅析
在JavaScript中有三种声明变量的方式:var.let.const.下文给大家介绍js中三种定义变量的方式const, var, let的区别. 1.const定义的变量不可以修改,而且必须初始 ...
- JavaScript中值类型和引用类型的区别
JavaScript的数据类型分为两类:原始类型和对象类型.其中,原始类型包括:数字.字符串和布尔值.此外,JavaScript中还有两个特殊的原始值:null和undefined,它们既不是数字也不 ...
- JavaScript中=、==、===以及!=、!==的区别与联系
JavaScript中=.==.===以及!=.!==的区别与联系 在JavaScript中,“=”代表赋值操作:“==”先转换类型再比较,“===”先判断类型,如果不是同一类型直接为false. ...
- JavaScript中object和Object有什么区别
JavaScript中object和Object有什么区别,为什么用typeof检测对象,返回object,而用instanceof 必须要接Object呢 ————————————————————— ...
- 深入理解Javascript中构造函数和原型对象的区别
在 Javascript中prototype属性的详解 这篇文章中,详细介绍了构造函数的缺点以及原型(prototype),原型链(prototype chain),构造函数(constructor) ...
- 关于javascript中apply()和call()方法的区别
如果没接触过动态语言,以编译型语言的思维方式去理解javaScript将会有种神奇而怪异的感觉,因为意识上往往不可能的事偏偏就发生了,甚至觉得不可理喻.如果在学JavaScript这自由而变幻无穷的语 ...
- javascript 中 offsetWidth,clientWidth;offsetHeight,clientHeight的区别
javascript 中 offsetWidth 是对象的可见宽度,包滚动条等边线,会随窗口的显示大小改变 clientWidth.offsetWidth.clientHeight区别IE6.0.FF ...
随机推荐
- VM Depot 中国上的 Bitnami 镜像更新至 Ubuntu 14.04 LTS
发布于 2014-08-13 作者 陈 忠岳 随着越来越多中国本地镜像源源不断地加入, VM Depot 中国站点也在日益壮大(http://msopentech.com/?p=865871) ...
- 在PC上使用串口向开发板传送文件
之前一直使用的是NFS,即网络挂载文件系统,不愁文件的传输问题,但是不幸的是 前几天网络出现故障,使这种方式没法使用 变好的驱动程序一直没法下载到开发板里面,蛋疼欲裂啊. 于是乎折磨则么使用串口传输 ...
- C# 导出 Excel 数字列出现‘0’的解决办法
在DataGird的中某一列全是数字并且长度大于15的字符,在导出excel时数字列第15-18位全部为0. 解决办法:在需导出数字列前加入英文字符状态的单引号(‘ ), 如: <asp:Tem ...
- 部署war包到Tomcat
1. 开发给到一个war包,假设叫 a-b-c.war. 2. 打开Tomcat安装路径 ,假设是“D:\Tomcat\apache-tomcat-7.0.68”,然后进入到 webapps文件夹. ...
- 12个强大的Web服务测试工具
在过去的几年中,web服务或API的普及和使用有所增加. web服务或API是程序或软件组件的集合,可以帮助应用程序进行交互或通过形成其他应用程序或服务器之间的连接执行一些进程/事务处理.基本上有两种 ...
- hdoj 2277 Change the ball【找规律】
Change the ball Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)T ...
- 关于封装unity3d的dll时候的进一步总结
在进行新项目的开发或者接手.后期维护其他一些项目时,经常性的,我们会遇到以下情况: 1.使用新的插件替换已有的bug比较多或者不在维护的插件: 2.因策划需求或美术资源的变更,而不得不更换游戏中的游戏 ...
- Quartz.Net任务调度框架
Quartz.Net是一个开源的任务调度框架,非常强大,能够通过简单的配置帮助我们定时具体的操作. 相对于我们用的线程里面while(true)然后sleep来执行某个操作,应该算的上是高端,大气,上 ...
- Sysstat LINUX工具包址
http://sebastien.godard.pagesperso-orange.fr/
- svn 树冲突
情况类似如下:(其中 removed_directory 是你工作的某个目录) 代码如下 复制代码 $svn statusD C removed_directory> local ...