JS: Проверьте, превышает ли текст ширину контейнера

Question

Есть ли функция js или jQuery, которая будет определять, будет ли innerHTML или текст находиться в пределах определенного количества пикселей от его контейнера?

Мне нужно будет сделать это за несколько сотен элементов на странице, поэтому производительность немного важна.

Пример - определить, является ли текст в этом <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

вам нужно обернуть в чем-то (р, отд угодно), то вы получите, что ширина элемента/высота

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

сделать свой расчет из $("td>p").width()

, но если это только текст или изображение (с max-width:100%), если вы не обертываете ...