javascript - 如何使用javascript计算文本的宽度？

Question

如何获取文本的宽度。

var e=document.createElement('span');
          e.style.fontSize = scope.fontsize;
          e.innerHTML = "test";
          console.log(e.offsetWidth);

宽度总是0

Answer 1

看起来您必须将创建的元素附加到文档。

var e=document.createElement('span');
document.body.appendChild(e);
e.style.fontSize = 14;
e.innerHTML = "test";
console.log(e.offsetWidth);
e.remove();

输出:23

---

隐藏元素不起作用以太。

 e.style.display= "none";

输出:0

---

要“隐藏它”，您可以添加这样的 CSS。但是随着添加的 remove() 它可能无论如何都不会出现。但是添加 position:absolute; 是个好主意，因为这将防止其余 html 内容闪烁。

   position:absolute;
   margin-left:-1000em;