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 相关文章推荐
十个优秀的Ajax/Javascript实例网站收集
Mar 31 Javascript
jQuery asp.net 用json格式返回自定义对象
Apr 07 Javascript
JS 精确统计网站访问量的实例代码
Jul 05 Javascript
JavaScript使用focus()设置焦点失败的解决方法
Sep 03 Javascript
JavaScript中对DOM节点的访问、创建、修改、删除
Nov 16 Javascript
基于JavaScript实现 网页切出 网站title变化代码
Apr 03 Javascript
基于jquery实现表格内容筛选功能实例解析
May 09 Javascript
javascript的replace方法结合正则使用实例总结
Jun 16 Javascript
javascript实现消灭星星小游戏简单版
Nov 15 Javascript
bootstrap表格内容过长时用省略号表示的解决方法
Nov 21 Javascript
vue.js移动数组位置,同时更新视图的方法
Mar 08 Javascript
JavaScript实现打字游戏
Feb 19 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
一个从别的网站抓取信息的例子(域名查询)
2006/10/09 PHP
检查url链接是否已经有参数的php代码 添加 ? 或 &
2010/02/09 PHP
PHP FTP操作类代码( 上传、拷贝、移动、删除文件/创建目录)
2014/05/10 PHP
Codeigniter中集成smarty和adodb的方法
2016/03/04 PHP
总结的一些PHP开发中的tips(必看篇)
2017/03/24 PHP
php之可变函数的实例详解
2017/09/13 PHP
完美解决JS中汉字显示乱码问题(已解决)
2006/12/27 Javascript
fancybox modal的完美解决(右上的X)
2012/10/30 Javascript
js精度溢出解决方案
2012/12/02 Javascript
页面只能打开一次Cooike如何实现
2012/12/04 Javascript
基于javascript滚动图片具体实现
2013/11/18 Javascript
详解bootstrap的modal-remote两种加载方式【强化】
2017/01/27 Javascript
JS获取短信验证码倒计时的实现代码
2017/05/22 Javascript
详解如何在 vue 项目里正确地引用 jquery 和 jquery-ui的插件
2017/06/01 jQuery
微信小程序使用request网络请求操作实例
2017/12/15 Javascript
vue2中使用sass并配置全局的sass样式变量的方法
2018/09/04 Javascript
bootstrap tooltips在 angularJS中的使用方法
2019/04/10 Javascript
vue slot与传参实例代码讲解
2019/04/28 Javascript
python 编程之twisted详解及简单实例
2017/01/28 Python
pytorch中tensor的合并与截取方法
2018/07/26 Python
python爬虫基础教程:requests库(二)代码实例
2019/04/09 Python
python批量修改ssh密码的实现
2019/08/08 Python
Python continue语句实例用法
2020/02/06 Python
Python列表倒序输出及其效率详解
2020/03/04 Python
基于FME使用Python过程图解
2020/05/13 Python
Python迭代器协议及for循环工作机制详解
2020/07/14 Python
阿里旅行:飞猪
2017/01/05 全球购物
Maison Lab荷兰:名牌Outlet购物
2018/08/10 全球购物
英国户外服装、鞋类和设备的领先零售商:Millets
2020/10/12 全球购物
如何使用PHP session
2015/04/21 面试题
Java基础知识面试题
2014/03/25 面试题
销售人员职业生涯规划范文
2014/03/01 职场文书
工作经历证明书范文
2014/11/02 职场文书
环境卫生标语
2015/08/03 职场文书
思想工作总结范文
2015/08/12 职场文书
mysql left join快速转inner join的过程
2021/06/30 MySQL