JS获取浮动(float)元素的style.left值为空的快速解决办法


Posted in Javascript onFebruary 19, 2017

解决办法:

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

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

问题原因:

如果父div的position定义为relative,子div的position定义为absolute,那么子div的style.left的值是相对于父div的值,这同offsetLeft是相同的,区别在于:

style.left 返回的是字符串,如28px,offsetLeft返回的是数值28,如果需要对取得的值进行计算,还用offsetLeft比较方便。

style.left是读写的,offsetLeft是只读的,所以要改变div的位置,只能修改style.left。

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

以上所述是小编给大家介绍的JS获取浮动(float)元素的style.left值为空的快速解决办法,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!

Javascript 相关文章推荐
getElementById在任意一款浏览器中都可以用吗的疑问回复
May 13 Javascript
javascript 写类方式之七
Jul 05 Javascript
对 jQuery 中 data 方法的误解分析
Jun 18 Javascript
JavaScript学习笔记之定时器
Jan 22 Javascript
readonly和disabled属性的区别
Jul 26 Javascript
使用JQuery实现的分页插件分享
Nov 05 Javascript
JS 设置Cookie 有效期 检测cookie
Jun 15 Javascript
JS笛卡尔积算法与多重数组笛卡尔积实现方法示例
Dec 01 Javascript
vue源码解析之事件机制原理
Apr 21 Javascript
vue实现密码显示与隐藏按钮的自定义组件功能
Apr 23 Javascript
VUE 直接通过JS 修改html对象的值导致没有更新到数据中解决方法分析
Dec 02 Javascript
Javascript执行流程细节原理解析
May 14 Javascript
Angular 输入框实现自定义验证功能
Feb 19 #Javascript
js实现九宫格的随机颜色跳转
Feb 19 #Javascript
原生JS实现垂直手风琴效果
Feb 19 #Javascript
js鼠标移动时禁止选中文字
Feb 19 #Javascript
canvas雪花效果核心代码分享
Feb 19 #Javascript
Ajax和Comet技术总结
Feb 19 #Javascript
thinkphp标签实现bootsrtap轮播carousel实例代码
Feb 19 #Javascript
You might like
php array_intersect比array_diff快(附详细的使用说明)
2011/07/03 PHP
PDO版本问题 Invalid parameter number: no parameters were bound
2013/01/06 PHP
php的zip解压缩类pclzip使用示例
2014/03/14 PHP
Yii框架调试心得--在页面输出执行sql语句
2014/12/25 PHP
WordPress中调试缩略图的相关PHP函数使用解析
2016/01/07 PHP
Laravel实现ApiToken认证请求
2019/10/14 PHP
js读取被点击次数的简单实例(从数据库中读取)
2014/03/07 Javascript
分享JavaScript与Java中MD5使用两个例子
2015/12/23 Javascript
jQuery实现从身份证号中获取出生日期和性别的方法分析
2016/02/25 Javascript
BootStrap组件之进度条的基本用法
2017/01/19 Javascript
JavaScript基础之AJAX简单的小demo
2017/01/29 Javascript
jQuery插件HighCharts绘制2D圆环图效果示例【附demo源码下载】
2017/03/09 Javascript
微信小程序 es6-promise.js封装请求与处理异步进程
2017/06/12 Javascript
使用jQuery实现鼠标点击左右按钮滑动切换
2017/08/04 jQuery
vue-cli 自定义指令directive 添加验证滑块示例
2017/10/19 Javascript
ES6扩展运算符用法实例分析
2017/10/31 Javascript
vue实现节点增删改功能
2019/09/26 Javascript
[57:38]2018DOTA2亚洲邀请赛3月30日 小组赛A组 OpTic VS OG
2018/03/31 DOTA
Python自动化运维之IP地址处理模块详解
2017/12/10 Python
Python面向对象思想与应用入门教程【类与对象】
2019/04/12 Python
python中pip的使用和修改下载源的方法
2019/07/08 Python
Python列表list操作相关知识小结
2020/01/29 Python
Python3实现监控新型冠状病毒肺炎疫情的示例代码
2020/02/13 Python
Python基于read(size)方法读取超大文件
2020/03/12 Python
解决pycharm下pyuic工具使用的问题
2020/04/08 Python
什么是python的函数体
2020/06/19 Python
HTML5微信播放全屏问题的解决方法
2017/03/09 HTML / CSS
银行职员思想汇报
2013/12/31 职场文书
建筑工程专业大学生求职信
2014/04/23 职场文书
产品生产计划书
2014/05/07 职场文书
学用政策心得体会
2014/09/10 职场文书
六一儿童节标语
2014/10/08 职场文书
投标承诺函范文
2015/01/21 职场文书
三八节祝酒词
2015/08/11 职场文书
浅谈Python中的函数(def)及参数传递操作
2021/05/25 Python
详解MySQL的内连接和外连接
2023/05/08 MySQL