解决办法:

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. Android线程之异步消息处理机制(二)——Message、Handler、MessageQueue和Looper

    异步消息处理机制解析 Android中的异步消息处理主要有四个部分组成,Message.Handler.MessageQueue和Looper. 1.Message Message是在线程之间传递的消 ...

  2. 基于STM32的uCOS-II移植详解

    百度:基于STM32的uCOS-II移植详解 源:基于STM32的uCOS-II移植详解

  3. *CCF 201612-2 工资计算(80)

    试题编号:201612-2 试题名称:工资计算 时间限制:1.0s 内存限制:256.0MB 问题描述 小明的公司每个月给小明发工资,而小明拿到的工资为交完个人所得税之后的工资.假设他一个月的税前工资 ...

  4. 写了一个复杂的sql语句

    $sp_sql = "select sp_ProductNo, sp_ProductName,sp_Standard,sp_Unit,sum(sp_Amount) as amount fro ...

  5. 《C++ Primer》 chapter 15 TextQuery

    <C++ Primer>中第15章为了讲解面向对象编程,举了一个例子:设计一个小程序,能够处理查询给定word在文件中所在行的任务,并且能够处理“非”查询,“或”查询,“与”查询.例如执行 ...

  6. Python3基础 用 while循环实现 斐波那契数列

    镇场诗: 诚听如来语,顿舍世间名与利.愿做地藏徒,广演是经阎浮提. 愿尽吾所学,成就一良心博客.愿诸后来人,重现智慧清净体.-------------------------------------- ...

  7. 配置tomcat及如何自动编译jsp文件

    1.myeclipse如何关联tomcat? 四个注意点...  必须一致! 2.别人修改过jsp不用重启服务器,我的却要每次重启服务器,网上找了很多方法都没有用,很是郁闷...最后发现了原来是bui ...

  8. 因子分析&主成分分析

    因子分析和主成分分析的异同点: 1.主成分分析仅仅是一种数据变换而不假设数据矩阵有什么样的结构形式 因子分析假定数据有特定的模型,而且齐总的因子满足特定的条件 2.因子分析和主成分分析都是从相关矩阵出 ...

  9. Hibernate懒加载的三种解决方案

    Hibernate懒加载的两种解决方案: 1.Hibernate.initialize(代理对象) 2.在*.hbm.xml映射文件中添加lazy="false"属性 3.使用op ...

  10. 【angularjs】【学习心得】ng-class总结

    原文:http://www.imooc.com/wenda/detail/236998 今天来说一点angularjs中看起来很简单但是实践起来又有不少问题的ng-class吧 ----------- ...