在jQuery中获取元素的宽度作为浮点数答案

【问题标题】：Getting the width of an element as a floating point in jQuery在jQuery中获取元素的宽度作为浮点数
【发布时间】：2012-11-30 22:10:18
【问题描述】：

我一直在寻找一种方法来获取非圆角元素的宽度。想要这个的原因是我有几个元素浮动到左边显示内联块，我试图自动调整它们中的文本，以便它们用完容器 div 的整个宽度。我是这样做的：

问题是总是有剩余的空间没有被使用。我相信这是因为当我将字体大小增加少量（即 0.01）以获得准确的大小时。元素的宽度不会改变，因为它是向下舍入的。我可以继续增加，直到它决定四舍五入然后总宽度超过限制时它们才会改变。这是一个显示我在说什么的 JSFiddle：

javascript 可能有点混乱，但基本上是为了节省时间，它从字体大小的大增量开始，然后当它达到目标大小时，它会使增量更小以更准确。

我尝试过使用：

$(this).width()
parseFloat($(this).css("width"))
window.getComputedStyle

但它们似乎都不起作用。

【问题讨论】：

你明白屏幕上的东西只能是整数个像素宽吗？小数像素可以通过两个相邻的协作项目来模拟，但一个单独的元素只能是整数个实际像素。
width等会一直返回整数，相信不会返回浮点值。
据此，它是特定于浏览器的，因此您不会总是得到浮点值：stackoverflow.com/questions/3603065/…
@jfriend00 是的，我知道在渲染过程中，事物是以整个像素为单位测量的，这很好，只是在我给出的示例中存在某些情况，其中有超过 5 个像素的空白空间很容易分割并使每个 div 的宽度增加一个像素。这不会发生，因为每次我计算宽度时，它都会将其切掉并在开始时抛出计算，这会变得复杂并最终导致很大的误差。
@kennypu 那么有没有另一种方法可以做到这一点，例如使用给定字体和字体大小将字符串长度确定为浮点数的函数？

【解决方案1】：

如果您想将浮点数转换为 while 数，您可以像这样修剪小数：$(this).width().toFixed(0)

或者你可以通过将不同的数字传递给toFixed来将其修剪到不同的小数位。

【讨论】：

【解决方案2】：

这对我有用：

$(this)[0].getBoundingClientRect().width

【讨论】：