当前位置：文江博客话题详情

使用 JavaScript 算出 DIV 可以容纳多少个字符

发布于 2024-09-12 23:36:44 字数 81 浏览 0 评论 0原文

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

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

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

太阳男子 2024-09-19 23:36:44

您可以迭代地将字符添加到隐藏的 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>

You could iteratively add your characters to a hidden div and check the width of that. Not sure if there is a better way.

Edit: Something like this:

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>

回复收藏 0 原文

~没有更多了~