在 jquery 中查找文本宽度答案

【问题标题】：Finding text width in jquery在 jquery 中查找文本宽度
【发布时间】：2012-03-13 08:32:21
【问题描述】：

我正在尝试以像素为单位计算文本宽度。

我将从html中取出一个字符串，这个字符串也可能包含一些特殊字符（在这个例子中只是一个连字符），并将这个字符串作为一个div的html内容，并计算字符串的宽度。

但我得到了奇怪的结果。

如果有更好的方法来获取文本宽度，跨浏览器！，请告诉我。

我做了一个小提琴：

谢谢！

【问题讨论】：

【解决方案1】：

<div> 元素设置为跨越其父元素的宽度，因此更改字体大小不会影响其实际宽度。将您的 <div> 更改为 <span> 应该可以满足您的需求。

【讨论】：

我稍微编辑了原文：jsfiddle.net/YaPcP/50。唯一的问题是它不会在每个浏览器中给出相同的结果。在 IE9 中它几乎关闭了 10 像素，而在 Opera 中则为 30 像素。

【解决方案2】：

将float: left; 添加到#holder

#holder 是宽度的测试容器，默认为width: auto;。换句话说，它覆盖了 100% 的浏览器窗口，并为您提供了混合的结果。

如果 #holder 超过其容器的宽度，您也可以考虑将其添加到 #holder。

【讨论】：

【解决方案3】：

它可能看起来很讨厌，但给你宽度：

【讨论】：