Warum gibt „this.style[property]' in JavaScript manchmal eine leere Zeichenfolge zurück?

Warum gibt „this.style[property]“ eine leere Zeichenfolge zurück?

In einem JavaScript-Programm wird beim Zugriff auf „this.style.style“ eine leere Zeichenfolge zurückgegeben Die Eigenschaft [property]‘ kann zu einer leeren Zeichenfolge führen. Dies kann auftreten, wenn versucht wird, den Wert eines Stils abzurufen, der in einem CSS-Stylesheet festgelegt wurde.

Die Eigenschaft „this.style[property]“ dient dem Zugriff auf Inline-Stile, bei denen es sich um Stile handelt, die direkt festgelegt werden mit dem Attribut „style“ in ein HTML-Element einfügen. Es werden keine Stile abgerufen, die in externen oder eingebetteten CSS-Stylesheets definiert sind.

Um dieses Problem zu beheben, verwenden Sie die Funktion getComputedStyle(). Diese Funktion berechnet die kombinierten Stile eines Elements, einschließlich der durch Stylesheets definierten:

const element = document.getElementById('myId');
const style = getComputedStyle(element);
console.log(style.height); // "100px"

In diesem Beispiel wird die Funktion „getComputedStyle()“ verwendet, um die Eigenschaft „height“ des Elements abzurufen. Die Konsole gibt den Wert „100px“ aus, der die im Stylesheet definierte Höhe darstellt.

Daher ist „this.style[property]“ zwar nützlich für den Zugriff auf Inline-Stile, aber nicht zum Definieren von Stilen geeignet in CSS-Stylesheets. Verwenden Sie „getComputedStyle()“, um den effektiven Stil eines Elements abzurufen, der alle Quellen umfasst.

Das obige ist der detaillierte Inhalt vonWarum gibt „this.style[property]' in JavaScript manchmal eine leere Zeichenfolge zurück?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!