>웹 프론트엔드 >CSS 튜토리얼 >JavaScript에서 DOM 요소의 계산된 글꼴 크기를 얻는 방법은 무엇입니까?

JavaScript에서 DOM 요소의 계산된 글꼴 크기를 얻는 방법은 무엇입니까?

Mary-Kate Olsen
Mary-Kate Olsen원래의
2024-11-26 14:30:10305검색

How to Get a DOM Element's Computed Font Size in JavaScript?

JavaScript에서 DOM 요소의 계산된 글꼴 크기 가져오기

DOM 요소의 계산된 글꼴 크기를 이해하는 것은 특히 복잡한 스타일 상속이 있는 요소를 조작할 때 중요합니다. 이 정보를 검색할 수 있는 방법은 다음과 같습니다.

Internet Explorer의 비표준 element.currentStyle 속성에 액세스할 수 있는 경우 다음 간단한 코드를 사용할 수 있습니다.

if (el.currentStyle) {
  return el.currentStyle['fontSize'];
}

지원하는 다른 브라우저의 경우 DOM 레벨 2 표준에서는 getComputeStyle 메소드를 활용할 수 있습니다.

if (document.defaultView && document.defaultView.getComputedStyle) {
  return document.defaultView.getComputedStyle(el, null).getPropertyValue('font-size');
}

currentStyle도 아니고 getCompulatedStyle을 사용할 수 있지만 element.style을 사용하여 인라인 CSS 속성에 계속 액세스할 수 있습니다.

else {
  return el.style['fontSize'];
}

이 함수는 다음과 같이 사용할 수 있습니다.

var element = document.getElementById('elementId');
var fontSize = getStyle(element, 'font-size');

위 내용은 JavaScript에서 DOM 요소의 계산된 글꼴 크기를 얻는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.