首頁 > web前端 > css教學 > 如何在 JavaScript 中取得元素的準確 CSS 屬性值(包括單位)?

如何在 JavaScript 中取得元素的準確 CSS 屬性值(包括單位)?

Mary-Kate Olsen
發布: 2024-12-11 09:10:20
原創
531 人瀏覽過

How Can I Get the Exact CSS Property Value (Including Units) of an Element in JavaScript?

取得元素CSS 屬性值作為集合(百分比/Em/Px)

取得元素中指定的CSS 屬性值樣式規則可能具有挑戰性,特別是當屬性已設定為不同的單位時。在 Google Chrome 中, getCompulatedStyle() 方法和 jQuery 的 css() 方法都會傳回以像素為單位的目前值。

解決方案: getMatchedStyle 函數

要解決此問題,開發了一個名為 getMatchedStyle() 的 JavaScript 函數。它接受一個元素和一個屬性作為參數,並傳回在 CSS 規則中設定的值。

範例

考慮以下 HTML 程式碼: CSS 規則:

以下 JavaScript 程式碼使用 getMatchedStyle()取得寬度值div:

結果:

以上是如何在 JavaScript 中取得元素的準確 CSS 屬性值(包括單位)?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板