Javascript 如何计算跨距中每个字符的宽度和高度

计算跨距中每个字符的宽度和高度的最佳方法是什么

比如说，html看起来像：

 <span style="font-size:12px">Test 100<span>

测试100

所以，一种方法是使用span的样式为每个字符创建一个虚拟span，并将其附加到dom中，然后获取其高度和宽度

例如，使用查询：

 var x = $('<span style="font-size:12px">' + 'T' + '</span'>);
 $('body').append(x); 
 var h = x.height(),  w= x.width();
 x.remove();

---

var x=$（''+'T'+'不要每次都创建一个span，而是尝试更改span的innerHTML并获取其宽度。这将更快，并且不会触发大量验证

试一试，它是否表现得更快？
您无法真正了解字符的大小，因为它占用的空间大小取决于它旁边的字符

例如，相邻的字符
A
和
V
被紧排，这样它们比
A
旁边的
A
或
V
旁边的
V
靠得更近。将相同数量的字符交错放置比将它们放在相同字符旁边占用的空间更小：

Avavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavavav

aaaaaaaaaaaavvvvvv
如果启用了kerning，则会出现这种情况。这些行占用的空间完全相同。@tom:这取决于您使用的浏览器，可能还有其他一些因素，如操作系统。我在Windows中使用Firefox，但这些行的长度不同。