关于 jquery和js获取宽度时只能取整数,取不到小数点
最近在改版自已的一个网站的时候,遇到了一个问题。
用jquery的width()函数获取元素宽度的时候,返回得到的是整数,而不是小数。
如下图,谷歌上显示的宽度为1078.89px

而我用控制台输出了 console.log( $('.mid-list').width() ); 结果如下

为了排除先入为主的认为四舍五入,我又调整了元素的宽度,为1079.1px

得出的结果,依然是1079

显然,其算法确实是四舍五入。
以防万一,我又试了document.getElementById().offsetWidth,得出的结果一样(显然jquery没有对js做什么过分的行为╮(╯_╰)╭)
以上,在大多数情况下,完全符合我们对js算法的要求,也是十分合理的设定。
但是,在这次我在改版网站的时候,打算用js来获取父元素宽度,再以此来算出内部元素之间的margin,并赋值。
结果不尽人意,获取width的时候得到的数据不准确,四舍的时候还好,但是五入的时候,原本的1078.89被算成了1079,从而计算出的margin略大,导致了内部元素的间隔不准确。
在本次情况的解决方法(只适用本次情况,类似width 五入后,导致计算值略大):将得到的width减一,也即 $('.mid-list').width() -1 , 虽然可能会导致计算出的margin略小,但是做前端的都清楚,“略大”比“略小”造成的危害要大很多。
关于 jquery和js获取宽度时只能取整数,取不到小数点的更多相关文章
- Easyui中使用jquery或js动态添加元素时出现的样式失效的解决方法
Easyui中使用jquery或js动态添加元素时出现的样式失效的解决方法 2014-03-27 11:44:46| 分类: Easy UI|举报|字号 订阅 可以使用$.parser.pa ...
- js限制文本框只能输入整数或者带小数点[转]
这篇文章是关于js限制文本框只能输入整数或者带小数点的内容,以下就是该内容的详细介绍. 做表单验证的时候是否会碰到验证某个输入框内只能填写数字呢,仅允许输入整数数字或者带小数点的数字.下面这段代码也许 ...
- jquery、js获取页面高度宽度等
jquery获取页面高度宽度 //获取浏览器显示区域(可视区域)的高度 : $(window).height(); //获取浏览器显示区域(可视区域)的宽度 : $(window).width(); ...
- Jquery和JS获取ul中li标签(转)
js 获取元素下面所有的li var content=document.getElementById("content"); var items=content.getElemen ...
- Jquery和JS获取ul中li标签
js 获取元素下面所有的li var content=document.getElementById("content"); var items=content.getElemen ...
- js获取宽度设置thickbox百分比
thickbox的宽高不好设为百分比,这样遇到不同的尺寸的电脑就会出现问题. 怎么做呢? 通过js来处理. <script type="text/javascript"> ...
- 对比js库分枝Jquery和js获取对象的方式
一.Jquery和JS的认识 对于这点不谈详细,但能有一个能有一个全面的印象,Jquery本质上也是JS,只不过用一句话概括就是 “write letter and do more”,写的更少,做 ...
- jquery.cookie.js 获取不到cookie的值
最近使用$.cookie获取cookie 的值.发现完全取不到.看了浏览器里也存了对应的值.可以添加,但是就是取不到., 折腾了半天,后来突然想起来加了个有可能带汉字的cookie键值.删掉就可以取出 ...
- JS获取年月日时分秒
var d = new Date(); ) + "-" + d.getDate() + " " + d.getHours() + ":" + ...
随机推荐
- mongodb学习(一)
操作系统环境:ubuntu. 安装mongodb:apt-get install mongodb 安装后运行:mongod提示:[initandlisten] exception in initAnd ...
- hp安装oracle报错解决
hpux上安装oracle 11gR2刚开始报错:集群验证框架内部发生了错误 解决办法http://www.it165.net/database/html/201509/14181.html 将文件后 ...
- Ref和Out参数的区别(转帖)
首先,如果不使用这两个关键字,那是什么样 呢? 看下面的例子: using System; class Test { static void Swap(ref int x, ref int ...
- SecureCRT:保存输出日志的方法
处理地址: http://blog.sina.com.cn/s/blog_64c1dd210101gzgz.html 或者: http://renchen.blog.51cto.com/4531967 ...
- myeclipse2014新建maven项目
1,首先安装maven,并配置. 2,新建maven project. 3,选择maven-archetype-webapp. 4,填写afrifact ID即为项目名称. 5,finish后 bui ...
- ToolTipController 事件触发显示时 避免闪烁的处理方法
private DevExpress.Utils.ToolTipController toolTipController1; private DevExpress.Utils.ToolTipContr ...
- Exception in thread "main" java.lang.UnsupportedClassVersionError: org/apache/maven/cli/MavenCli :
1.匹配jdk和maven的版本http://www.bubuko.com/infodetail-1757416.html jdk1.6 要匹配maven3.2.5 maven版本下载地址: ...
- 阿里yum源
转:http://mirrors.aliyun.com/help/centos?spm=5176.bbsr150321.0.0.d6ykiD 1.备份 mv /etc/yum.repos.d/Cent ...
- JavaScript中const、var和let区别浅析
在JavaScript中有三种声明变量的方式:var.let.const.下文给大家介绍js中三种定义变量的方式const, var, let的区别. 1.const定义的变量不可以修改,而且必须初始 ...
- LabVIEW如何调用C#Winform
界面交互并不是Labview的强项,使用Labview创建UI时候总会受制于VI有限的控件,有限的皮肤和有限的控件事件.而当需要实现UI的多文档的窗口,窗口的浮动停靠,动画等功能时还需要花很大的功夫. ...