首頁  >  文章  >  web前端  >  如何在 JavaScript 中透過 ID 檢索元素的所有樣式屬性?

如何在 JavaScript 中透過 ID 檢索元素的所有樣式屬性?

Susan Sarandon
Susan Sarandon原創
2024-10-30 22:42:03171瀏覽

How to Retrieve All Style Attributes of an Element by ID in JavaScript?

透過元素ID 取得所有樣式屬性

您可以透過使用下列方法提供元素ID 來取得套用於元素的所有樣式屬性:

循環遍歷CSSStyleDeclaration 物件:

迭代CSSStyleDeclaration 物件(getCompulatedStyle) 的索引以取得每個已知的屬性名稱。使用帶有此名稱的 getPropertyValue 來檢索值。

處理內聯樣式:

對於內聯樣式,請使用與其他樣式類型相同的循環方法。

把它們放在一起:

這是程式碼:

<code class="javascript">function getStyleById(id) {
    return getAllStyles(document.getElementById(id));
}

function getAllStyles(elem) {
    if (!elem) return [];

    var win = document.defaultView || window, style, styleNode = [];

    if (win.getComputedStyle) { /* Modern browsers */
        style = win.getComputedStyle(elem, '');
        for (var i=0; i<style.length; i++) {
            styleNode.push( style[i] + ':' + style.getPropertyValue(style[i]) );
        }
    } else if (elem.currentStyle) { /* IE */
        style = elem.currentStyle;
        for (var name in style) {
            styleNode.push( name + ':' + style[name] );
        }
    } else { /* Ancient browser..*/
        style = elem.style;
        for (var i=0; i<style.length; i++) {
            styleNode.push( style[i] + ':' + style[style[i]] );
        }
    }
    return styleNode;
}</code>

以上是如何在 JavaScript 中透過 ID 檢索元素的所有樣式屬性?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

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