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 相关文章推荐
Javascript中Event属性搜集整理
Sep 17 Javascript
js arguments,jcallee caller用法总结
Nov 30 Javascript
javascript中call和apply的用法示例分析
Apr 02 Javascript
jQuery下拉框的简单应用
Jun 24 Javascript
微信小程序 require机制详解及实例代码
Dec 14 Javascript
vue.js利用Object.defineProperty实现双向绑定
Mar 09 Javascript
jQuery实现页面倒计时并刷新效果
Mar 13 Javascript
Angularjs 动态添加指令并绑定事件的方法
Apr 13 Javascript
详解Node.js中path模块的resolve()和join()方法的区别
Oct 29 Javascript
30分钟快速实现小程序语音识别功能
Nov 27 Javascript
微信小程序分享功能onShareAppMessage(options)用法分析
Apr 24 Javascript
node.JS的crypto加密模块使用方法详解(MD5,AES,Hmac,Diffie-Hellman加密)
Feb 06 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将session信息存储到数据库的类实例
2015/03/04 PHP
Swoole-1.7.22 版本已发布,修复PHP7相关问题
2015/12/31 PHP
php处理静态页面:页面设置缓存时间实例
2017/06/22 PHP
基于js disabled="false"不起作用的解决办法
2013/06/26 Javascript
css+js实现部分区域高亮可编辑遮罩层
2014/03/04 Javascript
深入理解javascript原型链和继承
2014/09/23 Javascript
jQuery插件StickUp实现网页导航置顶
2015/04/12 Javascript
js利用正则表达式检验输入内容是否为网址
2016/07/05 Javascript
谈谈JavaScript中的几种借用方法
2016/08/09 Javascript
手机Web APP如何实现分享多平台功能
2016/08/19 Javascript
BootStrap无限级分类(无限极分类封装版)
2016/08/26 Javascript
使用jQuery,Angular实现登录界面验证码详解
2017/04/27 jQuery
Node.js对MongoDB数据库实现模糊查询的方法
2017/05/03 Javascript
JavaScript代码执行的先后顺序问题
2017/10/29 Javascript
vue使用axios实现文件上传进度的实时更新详解
2017/12/20 Javascript
使用淘宝镜像cnpm安装Vue.js的图文教程
2018/05/17 Javascript
JavaScript中的相等操作符使用详解
2019/12/21 Javascript
python 去除txt文本中的空格、数字、特定字母等方法
2018/07/24 Python
python 判断字符串中是否含有汉字或非汉字的实例
2019/07/15 Python
Python函数装饰器原理与用法详解
2019/08/16 Python
Python谱减法语音降噪实例
2019/12/18 Python
Python matplotlib画曲线例题解析
2020/02/07 Python
Pycharm激活码激活两种快速方式(附最新激活码和插件)
2020/03/12 Python
详解Windows下PyCharm安装Numpy包及无法安装问题解决方案
2020/06/18 Python
Python 在函数上添加包装器
2020/07/28 Python
python 解决selenium 中的 .clear()方法失效问题
2020/09/01 Python
python switch 实现多分支选择功能
2020/12/21 Python
BSTN意大利:德国街头和运动文化高品质商店
2020/12/22 全球购物
毕业生物理教师求职信
2013/10/17 职场文书
关于工资低的辞职信
2014/01/14 职场文书
中学教师培训制度
2014/01/31 职场文书
财务担保书范文
2014/04/02 职场文书
居委会四风问题个人对照检查材料
2014/09/25 职场文书
2014年节能工作总结
2014/12/18 职场文书
2016五一手机促销广告语
2016/01/28 职场文书
关于nginx 实现jira反向代理的问题
2021/09/25 Servers