如何使用 JavaScript 檢索 CSS 值？

使用JavaScript 取得CSS 值

除了使用JavaScript 設定CSS 值（例如document.getElementById('image_1').style top = '100px')，您也可以擷取特定樣式屬性的目前值。這對於各種目的都很有用，例如根據當前樣式動態調整元素的外觀。

要取得特定 CSS 屬性的值，可以使用 getComputedStyle() 方法。此方法將一個元素作為其參數，並傳回一個 CSSStyleDeclaration 對象，該物件表示該元素的計算樣式。 CSSStyleDeclaration 物件中的每個屬性都對應一個 CSS 屬性，該屬性的值反映了該樣式屬性的計算值。

以下是一個範例：

var element = document.getElementById('image_1'),
    style = window.getComputedStyle(element),
    top = style.getPropertyValue('top');
console.log(top);

在此範例中， getComputedStyle() 方法用於擷取 ID 為「image_1」的元素的計算樣式。然後使用 getPropertyValue() 方法取得該元素的「top」樣式屬性的值。然後，「top」屬性的值（在本例中可能是「100px」）可透過 top 變數取得，並可用於在 JavaScript 程式碼中進行進一步處理或操作。

以上是如何使用 JavaScript 檢索 CSS 值？的詳細內容。更多資訊請關注PHP中文網其他相關文章！