如何检查字符串大小是否大于容器的大小？

Question

在我的大小例如100x200px的div中，我有一个html格式的字符串。我想限制该字符串显示字符的数量，如果字符串大小（或长度？）更大这个div大小（那么我想使用工具提示）。任何想法如何做到这一点？我可以将该字符串转换为普通版本，然后检查大小，但这是一个好主意吗？

---

我发现要检查的文章：

http://blog.mastykarz.nl/measuring-the-length-of-a-string-in-pixels-using-javascript/

---

我注意到另一个问题，字符串修剪似乎有效，但是，我想查看修剪后的字符串保存其html标签

Answer 1

创建一个相同的div（但没有滚动限制），其中字符串在页面的某个位置，用户无法看到它，并检查其大小。

然后循环浏览字符串，同时一次删除几个字符，直到它适合。

Answer 2

你可以将字符串放在另一个（隐藏的）元素中，如span，禁用换行样式 - 在脚本中你可以得到这个跨度的宽度，并且可以比较它是否大于你的div。

别忘了设置合适的样式，例如white-space:nowrap

要限制固定大小字段，您只需设置overflow：hidden（您必须在隐身overflow:visible上设置span）。通过这种方式，字符被切断，用户可能会看到有更多文本。