텍스트가 넘칠 경우를 감지하십시오.

Question

요소의 텍스트가 해당 컨테이너를 넘치고 있는지 확인하는 방법이 있습니까?

예를 들어 <p>은 width: 100px입니다. 이 요소의 텍스트는 105 픽셀입니다. 내 text-overflow: ellipsis이 적용된 것을 볼 수 있지만 JS에 대해서도 알고 싶습니다.

jQuery 또는 일반 js가 정상입니다.

Answer 1

당신이 뭔가를 할 수 있습니다 :

/* 
* @param el DOM element or jQuery object 
* @return w width of the text 
*/ 
function getOverflowWidth(el) { 
    var $el = $(el); 
    var span = $el.wrapInner('<span />').find('span'); 
    var w = span.width(); 
    $el.html(span.html()); 
    return w; 
}