Question

是否有js或jQuery函数可以检测innerHTML或text是否在某个像素范围内被其容器剪切？

我需要在页面上为几百个元素执行此操作，因此性能有点重要。

示例 - 确定此<td>中的文本是否超出其宽度的5px：

<td class="cell">
  12,3423
</td>

.cell {
   width: 20px;
}

Answer 1

试试这个

$.fn.textWidth = function(){
  var html_org = $(this).html();
  var html_calc = '<span>' + html_org + '</span>';
  $(this).html(html_calc);
  var width = $(this).find('span:first').width();
  $(this).html(html_org);
  return width;
};

$(function(){
   alert($('.cell').textWidth());    
});

小提琴http://jsfiddle.net/Hpyay/

Calculating text width

可能会重复（及以上代码从复制而来）

Answer 2

你需要包装一些东西（p，div）然后你得到那个元素宽度/高度

 <td><p>text...</p></td>

从$("td>p").width()

进行计算

但如果它只是文字或图像（带max-width:100%），除非你没有... ...

JS：检查文本是否超过容器宽度

2 个答案: