Javascript 单空格字体字符串宽度

我有一个输入元素，输入到一个列表元素中，两者都使用相同的单空格字体

char\u width\u test

是

span

元素的ID，该元素包含1个具有相同单空格字体的字符。我检查这个宽度和宽度 与输入字段中给定的字符串长度相乘，以计算从该字符串创建的列表项的宽度

var ul = document.getElementById('posts_list');
var li = document.createElement('li');
var txt = document.createTextNode(str);
ul.appendChild(li);
li.innerHTML = str;

li.style.width = (($("#char_width_test").width() * str.length)) + 'px';

---

上面的代码生成的宽度的空格越多，字符串越长。似乎有一些变量影响了我缺少的宽度？

字符之间存在紧排，因此一个字符的宽度与您想要的不完全相同

一旦确定了一个字母的宽度和字距大小，就需要

n*char\u width+（n-1）*字距宽度

才能更精确

---

如果跨度上没有填充或边距，我可能会尝试类似

kerning=width\u of_two\u characters-（width\u of_one\u character*2）

。看看结果如何。

似乎是一个不错的解决方案，但是我得到了两个字符的宽度\u=20和一个字符的宽度\u=10