我找遍了，没找到这个。我试图获得一个 div 的宽度，但如果它有一个小数点，它会四舍五入这个数字。
例子：
#container{
background: blue;
width: 543.5px;
height: 20px;
margin: 0;
padding: 0;
}
如果我这样做$('#container').width();，它将返回 543 而不是 543.5。我如何让它不舍入数字并返回完整的 543.5（或任何数字）。
如何使 jQuery 不舍入 .width() 返回的值？
IT技术
javascript
jquery
css
2021-02-24 03:29:00
5个回答
使用原生Element.getBoundingClientRect而不是元素的样式。它是在 IE4 中引入的，并被所有浏览器支持：
$("#container")[0].getBoundingClientRect().width
注意：对于 IE8 及以下，请参阅MDN 文档中的“浏览器兼容性”说明。
罗斯艾伦的答案是一个很好的起点，但使用getBoundingClientRect().width还将包括填充和边框宽度，这不是jquery 的宽度函数的情况：
返回的 TextRectangle 对象包括内边距、滚动条和边框，但不包括边距。在 Internet Explorer 中，边界矩形的坐标包括客户区的上边框和左边框。
如果您的意图是获得width精确的值，则必须像这样删除填充和边框：
var a = $("#container");
var width = a[0].getBoundingClientRect().width;
//Remove the padding width (assumming padding are px values)
width -= (parseInt(a.css("padding-left")) + parseInt(a.css("padding-right")));
//Remove the border width
width -= (a.outerWidth(false) - a.innerWidth());
只是想在这里添加我的经验，尽管问题很老：上面的共识似乎是 jQuery 的舍入实际上与未舍入的计算一样好——但在我一直在做的事情中似乎并非如此.
我的元素通常具有流体宽度，但内容通过 AJAX 动态更改。在切换内容之前，我临时锁定了元素的尺寸，这样我的布局就不会在转换过程中反弹。我发现像这样使用 jQuery：
$element.width($element.width());
正在引起一些有趣的事情，例如实际宽度和计算宽度之间存在子像素差异。（具体来说，我会看到一个单词从一行文本跳转到另一行，表明宽度已更改，而不仅仅是锁定。）从另一个问题 -获取元素的实际浮点宽度- 我发现outwindow.getComputedStyle(element).width将返回一个未舍入的计算。所以我把上面的代码改成了
var e = document.getElementById('element');
$('#element').width(window.getComputedStyle(e).width);
用那个代码——没有有趣的弹跳！这经验似乎表明，未舍入的值实际上做事情到浏览器，对不对？（就我而言，Chrome 版本为 26.0.1410.65。）
你可以使用getComputedStyle它：
parseFloat(window.getComputedStyle($('#container').get(0)).width)
使用以下方法获得准确的宽度：
var htmlElement=$('class or id');
var temp=htmlElement[0].style.width;