Heim >Web-Frontend >CSS-Tutorial >Wie greife ich mit JavaScript auf CSS-Variablen zu?

Wie greife ich mit JavaScript auf CSS-Variablen zu?

Linda Hamilton
Linda HamiltonOriginal
2024-11-24 22:22:14685Durchsuche

How Do I Access CSS Variables Using JavaScript?

So greifen Sie auf CSS-Variablen in JavaScript zu

Durch den Zugriff auf CSS-Variablen aus JavaScript können Sie den Stil Ihrer Webanwendung dynamisch manipulieren. So können Sie dies erreichen:

Schritt 1: Berechnete Stile abrufen

Verwenden Sie die Funktion getComputedStyle, um die berechneten Stile des Zielelements abzurufen.

Schritt 2: Immobilienwert ermitteln

Nutzen Sie die getPropertyValue-Methode zum Abrufen des Werts der gewünschten CSS-Variablen.

Syntax:

getComputedStyle(element).getPropertyValue('--variable-name');

Beispiel:

An Rufen Sie den Wert der im bereitgestellten Code deklarierten CSS-Variablen --color-font-general ab Snippet:

var style = getComputedStyle(document.body);
var color = style.getPropertyValue('--color-font-general');

Dieser Code erfasst den Wert der CSS-Variablen und speichert ihn in der Farbvariablen.

Das obige ist der detaillierte Inhalt vonWie greife ich mit JavaScript auf CSS-Variablen zu?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
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