解决办法:

1.使用行内样式设置元素的top和left值;

2.or直接获取元素的offsetLeft得到相关数值,还不需要parseInt

问题原因:

如果父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的值需要事先定义,否则取到的值为空,而且必须是以行内样式的形式定义,如果定义在css里,style.left的值仍然为undefined;而offsetLeft则仍然能够取到,无需事先定义div的位置。

js获取浮动(float)元素的style.left值为空的解决办法的更多相关文章

  1. js 获取iframe页面元素

      js 获取iframe页面元素 CreationTime--2018年8月16日18点00分 Author:Marydon <!-- chart图表 --> <iframe id ...

  2. JS获取HTML DOM元素的方法

    JS获取HTML DOM元素有八种方法: 1.根据id获取标签元素: document.getElementById("id名"); 2.根据标签名获取标签列表: document ...

  3. [Jmeter]Xpath获取元素某个属性的值,以及获取最后一个元素某个属性的值

    XPath获取元素某个属性的值 XPath query:  clients/attribute::total XPath获取最后一个元素某个属性的值 XPath query:   /clients/c ...

  4. (转载)js(jquery)的on绑定点击事件执行两次的解决办法

    js(jquery)的on绑定点击事件执行两次的解决办法—不是事件绑定而是事件冒泡 遇到的问题:jquery中用.on()给页面中新加的元素添加点击事件时,点击事件源,绑定的事件执行两次,这里的ale ...

  5. JS获取表单元素的value

    <!-- 1.option selected属性,如果我们在下拉列表里面选择了一个option那么他的selected="true" ,如果我们想设置当前的option是选中 ...

  6. js获取精确的元素宽高(普通获取高度会有误差)

    当js获取元素宽高时, 并不是一个精确的数字,如果想获取真正的宽高大致方法如下 var oStyle = obj.currentStyle ? obj.currentStyle : window.ge ...

  7. JS获取HTML DOM元素的8种方法

    什么是HTML DOM 文档对象模型(Document Object Model),是W3C组织推荐的处理可扩展置标语言的标准编程接口.简单理解就是HTML DOM 是关于如何获取.修改.添加或删除 ...

  8. 原生JS获取HTML DOM元素的8种方法

    JS获取DOM元素的方法(8种) 通过ID获取(getElementById) 通过name属性(getElementsByName) 通过标签名(getElementsByTagName) 通过类名 ...

  9. js获取div基础元素

    1.js获取div元素 clientHeight 获取对象的高度,不计算任何边距.边框.滚动条,但包括该对象的补白. clientLeft 获取 offsetLeft 属性和客户区域的实际左边之间的距 ...

随机推荐

  1. coreGraphs和动画

    http://www.jianshu.com/p/b71c3d450e8e http://blog.csdn.net/volcan1987/article/details/9969455 http:/ ...

  2. [转载] centos6.x x64 安装python2.7

    本文转载自: http://www.centoscn.com/image-text/install/2016/0323/6906.html CentOS的设计理念中有一点是:持久可用.要达到这个目的, ...

  3. Java IO面试

    1. 讲讲IO里面的常见类,字节流.字符流.接口.实现类.方法阻塞. 字节流和字符流的区别: 1)字节流处理单元为1个字节,操作字节和字节数组,而字符流处理的单元为2个字节的Unicode字符,分别操 ...

  4. 文件查找和比较命令 来自: http://man.linuxde.net/find

    文件查找和比较1.find命令,用来在指定目录下查找文件.任何位于参数之前的字符串都将被视为欲查找的目录名.如果使用该命令时不设置任何参数,则find命令则在当前目录下查找子目录与文件.并且将查到的子 ...

  5. centos5.5 mount new harddisk

    Linux 系统挂载数据盘 1.查看数据盘  使用"fdisk-l"命令查看 2. 对数据盘进行分区 执行"fdisk /dev/sdb"命令,对数据盘进行分区 ...

  6. Linux在线安装git(亲测成功)

    一.先检测是否已安装 安装git需要安装一些依赖,但是安装依赖之前需要先检测一下是否已经安装了git. rpm -qa | grep zlib-devel 二.具体安装命令 如果以前没有安装过,则下载 ...

  7. #图# #SPFA# ----- codevs1021 玛丽卡

    codevs1021 玛丽卡 题目描述 Description麦克找了个新女朋友,玛丽卡对他非常恼火并伺机报复.因为她和他们不住在同一个城市,因此她开始准备她的长途旅行.在这个国家中每两个城市之间最多 ...

  8. oracle 查询哪些表分区

    如果查询当前用户下得分区表:select * from user_tables where partitioned='YES'如果要查询整个数据库中的分区表:select * from dba_tab ...

  9. Flex移动皮肤开发(三)

    范例文件 mobile-skinning-part3 在关于创建Flex移动皮肤系列文章的第二部分里,我们讨论了屏幕密度(DPI)对组件皮肤以及移动应用布局所带来的影响. 我还展示了如何使用缩放应用, ...

  10. margin三个值

    http://www.cnblogs.com/wangkongming/p/3204734.html margin标记可以带一个.二个.三个.四个参数,各有不同的含义. margin: 20px;(上 ...