오늘은 텍스트 너비를 구하는 문제에 부딪혔습니다. 결국 외국 사이트에서 방법을 찾았지만 바로 사용할 수 없어서 수정해서 프로젝트에 성공적으로 사용했습니다. 여기서 공유하겠습니다.
먼저 본문 태그 끝에 하위 태그를 추가하세요.
test
그런 다음 해당 CSS 코드를 추가하세요.
#ruler {
visibility:
white- space: nowrap;
font-size: 24px ;
}
다음으로 String 프로토타입에서 텍스트 너비를 구하는 함수를 직접 추가하고 js에 다음 코드를 추가합니다. 코드:
String.prototype.visualLength = function ()
{
var rule = $("# rule");
ruler.text(this)
return rule[0].offsetWidth;
마지막으로 텍스트 너비를 구해야 하는 위치에 호출하세요. 예:
var text = "test";
var len = text.visualLength()
주요 아이디어는 숨겨진 라벨을 추가하는 것입니다. 레이블에 값이 할당될 때마다 레이블의 길이를 가져와 텍스트 너비를 얻습니다. DOM에 추가된 태그만 길이를 얻을 수 있다는 점에 유의해야 합니다.
도움이 되셨다면 도움이 되셨으면 좋겠습니다 감사합니다 :)