Heim > Web-Frontend > CSS-Tutorial > Hauptteil

Wie erhalte ich die berechnete Schriftgröße eines DOM-Elements in JavaScript?

Mary-Kate Olsen
Freigeben: 2024-11-26 14:30:10
Original
224 Leute haben es durchsucht

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

Ermitteln der berechneten Schriftgröße eines DOM-Elements in JavaScript

Das Verständnis der berechneten Schriftgröße eines DOM-Elements ist von entscheidender Bedeutung, insbesondere bei der Bearbeitung von Elementen mit komplexer Stilvererbung. So können Sie diese Informationen abrufen:

Wenn Sie Zugriff auf die nicht standardmäßige element.currentStyle-Eigenschaft von Internet Explorer haben, können Sie diesen einfachen Code verwenden:

if (el.currentStyle) {
  return el.currentStyle['fontSize'];
}
Nach dem Login kopieren

Für andere Browser, die dies unterstützen Für den DOM Level 2-Standard können Sie die getComputedStyle-Methode verwenden:

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

Als Fallback, wenn weder currentStyle noch getComputedStyle verfügbar sind, können Sie weiterhin mit element.style auf die Inline-CSS-Eigenschaft zugreifen:

else {
  return el.style['fontSize'];
}
Nach dem Login kopieren

Diese Funktion kann wie folgt verwendet werden:

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

Das obige ist der detaillierte Inhalt vonWie erhalte ich die berechnete Schriftgröße eines DOM-Elements in JavaScript?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage