스타일시트에 정의된 경우에도 HTML에서 글꼴 크기를 안정적으로 검색하고 업데이트하려면 어떻게 해야 합니까?

HTML에서 글꼴 크기 검색

HTML에서는 CSS를 사용하여 요소의 글꼴 크기를 지정할 수 있습니다. 일반적으로 style.fontSize 속성은 글꼴 크기를 설정하거나 검색하는 데 사용됩니다. 그러나 스타일시트에 정의된 글꼴 ​​크기를 검색하는 것이 어려울 수 있습니다.

style.fontSize 사용

다음 예에서는 글꼴을 검색한 후 업데이트하려고 시도합니다. style.fontSize:

var x = document.getElementById("foo").style.fontSize;
document.getElementById("foo").style.fontSize = x + 1;

를 사용하여 요소의 크기를 지정합니다. 그러나 이 코드는 다음과 같은 경우 작동하지 않을 수 있습니다. 글꼴 크기는 CSS 스타일시트에서 외부적으로 정의됩니다. 이러한 경우 style.fontSize는 빈 문자열을 반환하므로 예상치 못한 결과가 발생할 수 있습니다.

window.getCompulatedStyle

사용하여 글꼴 크기를 정확하게 검색하려면 스타일시트에 정의된 경우 window.getCompulatedStyle 메서드를 사용하세요. 이 메소드는 요소의 실제 스타일을 계산합니다.

var el = document.getElementById('foo');
var style = window.getComputedStyle(el, null).getPropertyValue('font-size');
var fontSize = parseFloat(style); // Converts the retrieved value to a float
el.style.fontSize = (fontSize + 1) + 'px'; // Updates the font size

window.getCompulatedStyle을 활용하면 스타일시트에 정의된 방식에 관계없이 요소의 글꼴 크기를 안정적으로 검색하고 업데이트할 수 있습니다.

위 내용은 스타일시트에 정의된 경우에도 HTML에서 글꼴 크기를 안정적으로 검색하고 업데이트하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!