


Wie erhalte ich den tatsächlichen Schriftartnamen, der von einem DOM-Element in JavaScript verwendet wird?
Abrufen der berechneten Schriftartenfamilie in JavaScript
In dieser Fortsetzung einer früheren Frage möchten wir eine Lösung zum Abrufen bereitstellen der tatsächliche Schriftartname eines DOM-Elements mit JavaScript.
Die generische Funktion „berechneter Stil“ gibt die vollständige Schriftartzeichenfolge zurück, die für ein Element definiert ist, einschließlich Fallbacks. Um dies jedoch mit Dropdown-Schriftfamilieneinträgen abzugleichen, benötigen wir einen festen Schriftnamen für die tatsächlich verwendete Schriftart.
Lösung:
Um die berechnete Schriftfamilie abzurufen Erwägen Sie den folgenden Ansatz:
<code class="javascript">let para = document.querySelector('p'); let compStyles = window.getComputedStyle(para); let computedFontFamily = compStyles.getPropertyValue('font-family') // e.g. "Times New Roman"</code>
Hinweise:
- Diese Methode gibt nur die für das Element angegebene primäre Schriftfamilie zurück.
- Einige Browser (z. B. Chrome und Firefox) unterstützen die Eigenschaft „Schriftfamilie“, wie im CSS Font Interface Module Level 3 definiert. Diese Schnittstelle bietet eine detailliertere Kontrolle über die berechnete Schriftfamilie.
Quelle:
https://developer.mozilla.org/en-US/docs/Web/API/Window/getComputedStyle
Das obige ist der detaillierte Inhalt vonWie erhalte ich den tatsächlichen Schriftartnamen, der von einem DOM-Element in JavaScript verwendet wird?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Heiße KI -Werkzeuge

Undresser.AI Undress
KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover
Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool
Ausziehbilder kostenlos

Clothoff.io
KI-Kleiderentferner

AI Hentai Generator
Erstellen Sie kostenlos Ai Hentai.

Heißer Artikel

Heiße Werkzeuge

Notepad++7.3.1
Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version
Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1
Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6
Visuelle Webentwicklungstools

SublimeText3 Mac-Version
Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Heiße Themen

Erstellen Sie ein JavaScript -Kontaktformular mit dem Smart Forms Framework

Hinzufügen von Kastenschatten zu WordPress -Blöcken und -Elementen

Erstellen Sie einen Inline -Texteditor mit dem inhaltlichen Attribut

Entmystifizierende Bildschirmleser: Zugrunde Formen und Best Practices

Machen Sie Ihren ersten Seltsamen -Sufle -Übergang

Vergleich der 5 besten PHP -Formbauer (und 3 kostenlose Skripte)

Datei hochladen mit Multer in node.js und ausdrücken
