為什麼「this.style[property]」會為繼承的樣式傳回空字串？

理解this.style[property] 的空字串回傳

存取HTML 元素的style 屬性時，使用語法this.style[property]，需要注意的是，它只會傳回直接套用於元素本身的樣式。不包括從外部樣式表繼承的樣式或從級聯規則計算的樣式。

在提供的程式碼片段中：

function css(prop, value) {
  if (value == null) {
    // retrieve style
    return this.style[prop]; // returns an empty string
  }
  // set style
}

呼叫 element.css("height") 將傳回一個空字串，因為高度樣式在外部樣式表中定義。套用於元素的內聯樣式（背景：#CCC）與此處無關。

如何擷取計算的樣式資訊

擷取樣式的有效值，包括繼承或計算的樣式，使用 getComputedStyle() 函數：

const style = getComputedStyle(element);
console.log(style.height); // returns "100px"

以上是為什麼「this.style[property]」會為繼承的樣式傳回空字串？的詳細內容。更多資訊請關注PHP中文網其他相關文章！