我正在尝试计算HTML中跨度的总宽度，包括第一个和最后一个字符的左右方位。我已经尝试过Javascript的offsetWidth和jQuery的宽度＆amp; outerWidth函数，但它们都没有返回我正在寻找的正确值。这是我的意思example。在Firefox中运行时，计算出的宽度为135px，而使用Web Developer插件进行测量时，实际宽度为141px。
修改
这是我尝试过的，以下是它给我的价值： offsetWidth = 135 jQuery.width（）= 135 jQuery.outerWidth（）= 135
他们都没有计算'f'上的6px悬空（这会使宽度为141）。
答案 0 :(得分：2)
可悲的是，没有直接的解决方案，因为它超出了盒子模型的范围 - 浏览器本身在渲染布局时无法识别字母'f'的悬垂。如果将<span>包裹在<div>的{{1}}内，width: 135px，则可以自己看到这一点 - 不显示滚动条，只会切断悬垂。这也是为什么firebug报告宽度而没有悬垂的原因。
正如@Aaron指出的那样，等宽字体不存在问题，因为在这些字体中没有字母超出字符的固定宽度框。
找到实际宽度的唯一方法是通过基于像素（而不是基于布局）的方法。我可以想到一种方法：使用相同的字体将相同的文本绘制到overflow: auto元素上，然后测量像素宽度。
答案 1 :(得分：1)
实际上，我认为问题在于字体本身。我将jsfiddle更改为font-family：monospace，它全部包含在灰色框内（并且因此正确计算）。即使将其保留为原始字体，但将样本更改为“aaa”或“mmmm”也很有效。它只是该字体中的“f”字形，它正在为你吹嘘。
不幸的是，我不知道有哪个DOM属性可以解释这个问题。不确定这是一个很好的答案，但我无权对这个问题发表评论，并认为这些发现可能有助于指明你正确的方向......
答案 2 :(得分：0)
jQuery的.width()怎么样？
<span id="spanId"> ... </span>
和
var w = $('#spanId').width();