如何使用JavaScript计算一行中的字符数

Question

假设我有一个宽度为200px且字体大小为16的div。现在我想计算一个可以放入div行的字符数。如何使用JavaScript或jQuery计算字符数。

Answer 1

更新：哦，我忽略了隐藏的评论。上面发布的CSS解决方案肯定更适合这项工作。我的回答直接解决了计算适合一行的字符的问题。我不会删除它，因为有人可能会发现它有用。

即使您有比例字体，也可以获得一行中可以容纳的字符数。有两种方法 - 使用以下技巧或measureText的{​​{1}}方法。

CanvasRenderingContext2D

Answer 2

  

实际上我想在div中截断我的文本，以便它完全适合   进入那个div（文本长度非常大）

您可以使用css：

执行此操作

white-space: nowrap;
overflow:hidden;
text-overflow: ellipsis; //Doesn't work in all browsers, just adds "..."

http://jsfiddle.net/46AML/

Answer 3

如果每个字符的宽度相同，则只能计算每行的字符数。这适用于所有固定宽度字体，例如stackoverflow的问题编辑器中的字体。

如果您确保使用固定宽度字体，则可以计算单个字符的宽度，例如使用function posted in this answer。然后，简单地将<div>的宽度除以字符的宽度。