使用 JavaScript 计算 DIV 中可以容纳多少字符

Question

有谁知道使用 JavaScript 计算出 HTML 中的 DIV 块中可以容纳多少个字符的最佳方法是什么？

任何建议都会有很大帮助。

Answer 1

您可以迭代地将字符添加到隐藏的 div 中并检查其宽度。不确定是否有更好的方法。

编辑：像这样的东西：

var targetWidth = document.getElementById('DivToCheck').clientWidth;
var stringToFit = 'abcdefghijk';
var numChars = 0;
for(var i=0; i < stringToFit.length; i++)
{
   document.getElementById('hiddenDiv').innerHTML += stringToFit.charAt(i);
   if (document.getElementById('hiddenDiv').clientWidth > targetWidth)
   {
       numChars = i - 1;
       break;
   }
}

<div id="hiddenDiv" style="visibility: hidden; width: auto;"></div>