首頁 >web前端 >css教學 >為什麼在主樣式表中設定時 myDiv.style.display 會返回空白?

為什麼在主樣式表中設定時 myDiv.style.display 會返回空白?

Susan Sarandon
Susan Sarandon原創
2024-11-06 18:51:021055瀏覽

Why Does myDiv.style.display Return Blank When Set in a Master Stylesheet?

在主樣式表中設定時,myDiv.style.Display 傳回空白

使用myDiv.style 設定div 元素的顯示樣式時。顯示 (JavaScript),如果主樣式表中的顯示樣式設定為 none,則預期行為會傳回空白字串。出現這種情況是因為 JavaScript 無法直接存取計算樣式,也就是透過 CSS 規則套用的樣式。

要解決此問題並擷取準確的顯示樣式,建議使用 getCompulatedStyle() 方法。此方法允許存取元素的計算樣式,包括主樣式表中定義的樣式。

以下是如何使用getCompulatedStyle() 的範例:

function getStyle(id, name) {
    var element = document.getElementById(id);
    return element.currentStyle ? element.currentStyle[name] : window.getComputedStyle ? window.getComputedStyle(element, null).getPropertyValue(name) : null;
}

var display = getStyle('myDiv', 'display');
alert(display); // Will print 'none' or 'block' or 'inline' etc.

透過利用getCompulatedStyle() ,您可以精確地擷取元素的顯示樣式,即使它是在主樣式表中設定的。這可確保使用 JavaScript 切換顯示樣式時功能正常。

以上是為什麼在主樣式表中設定時 myDiv.style.display 會返回空白?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn