offsetLeft与style.left的区别
参考: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的区别的更多相关文章
- 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 ...
- android 中theme.xml与style.xml的区别
from://http://liangoogle.iteye.com/blog/1848448 android 中theme.xml与style.xml的区别: 相同点: 两者的定义相同. <r ...
- offsetLeft与style.left区别
在javascript中经常遇到style.left和offsetLeft,那么它们有什么区别呢?今天我们来分析下 offsetLeft:获取当前元素相对于父元素的左侧偏移量,比如该元素设置为rela ...
- 04-offsetLeft和style.left的区别
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- .style, .getComputedStyle(),.currentStyle区别
1)style只能获取行间样式(写在标签里面的):能读能写 2)currentStyle是专属ie的属性,区别他返回的是最终样式 及包括行间和外链css 3)getComputedStyle是一个可以 ...
- js中的offsetLeft和style.left
(1)style.left是带单位"px"的,而offsetLeft没有单位,另外,style.left必须是内联样式,或者在JS中通过style.left赋值,否则取得的将为空字 ...
- js和jq中常见的各种位置距离之offsetLeft和position().left的区别(四)
offsetLeft:元素的边框的外边缘距离与已定位的父容器(offsetparent)的左边距离(不包括元素的边框和父容器的边框).position().left:使用position().left ...
随机推荐
- 试题系列四(袋中有6红球 3黄球 3绿球,从中取6个球,求所有拿到球的颜色的可能 c(12,6))
1.袋中有6红球 3黄球 3绿球,从中取6个球,求所有拿到球的颜色的可能 c(12,6) #include<stdio.h> int main(int argc, char** argv) ...
- java中Calendar.getInstance()和new Date()的差别是什么?
java中Calendar.getInstance()和new Date()的差别如下: Calendar.getInstance()是获取一个Calendar对象并可以进行时间的计算,时区的指定ne ...
- Redis的README.md
This README is just a fast *quick start* document. You can find more detailed documentation at http: ...
- Time Limit Exceeded 求逆序对数。
/** 题目:Time Limit Exceeded 链接:https://oj.ejq.me/problem/28 题意:求逆序对数. 思路:树状数组求逆序对数.维护前面有多少个<=当前数的数 ...
- 介绍两款Linux文件恢复工具,ext3grep与extundelete https://www.cnblogs.com/lazyfang/p/7699994.html
介绍两款Linux文件恢复工具,ext3grep与extundelete,可能在关键时刻会有所帮助.ext3grep仅对ext3文件系统有效,extundelete对ext3与ext4文件系统都有效 ...
- CentOS7安装mysql提示“No package mysql-server available
在CentOS7上安装mysql时,出现了以下的提示: 原因是: CentOS7带有MariaDB而不是MySQL,MariaDB和MySQL一样也是开元的数据库,您可以使用yum -y instal ...
- Linux make语法
make是一种控制编译或者重复编译软件的工具. make可以自动关键软件的编译内容.方式和时机,从而使程序员把更多的精力集中在编写代码上. make主要的机制是在命令行键入make命令,make会自动 ...
- makefile编写---单个子目录编译自动变量模板ok
1.自动化变量通配符http://blog.sina.com.cn/s/blog_7c95e5850101b38l.html 2.wildcard 使用http://blog.csdn.net/lia ...
- bat遍历当前目录下的文件,批量重命名
@echo off setlocal enabledelayedexpansion for %%x in (*) do ( if not "%%x"=="demo.bat ...
- android Material design是什么
Material design概述: Material design是一套UI样式标准,应该会提供一些新的API这写API包含了以下五大模块内容,分别是: Material Theme New Wid ...