Bagaimana untuk Mendapatkan Semua Gaya Elemen Hanya Menggunakan IDnya?

Cara Mengumpul Semua Gaya daripada Elemen Hanya Menggunakan IDnya

Dalam soalan ini, kami berhasrat untuk membangunkan fungsi, getStyleById, yang mendapatkan semula semua atribut gaya dan nilai sepadannya untuk elemen tertentu, hanya diberikan IDnya. Fungsi ini harus mempertimbangkan kedua-dua gaya sebaris dan gaya yang ditakrifkan dalam fail CSS.

Penyelesaian:

Untuk mencapai ini, kami boleh menggunakan pendekatan yang komprehensif:

1. Gelung melalui Properties: Dapatkan semula semua nama sifat yang diketahui menggunakan gelung yang berulang melalui objek CSSStyleDeclaration (getComputedStyle). Untuk setiap nama, dapatkan nilai menggunakan getPropertyValue.
2. Optimumkan Gelung: Tingkatkan kecekapan dengan menyimpan getComputedStyle di luar gelung dalam pembolehubah berasingan.
3. Pengendalian Gaya Sebaris : Gunakan gelung untuk…dalam gelung biasa untuk mendapatkan maklumat gaya sebaris.

Pelaksanaan Kod:

<code class="javascript">function getStyleById(id) {
    return getAllStyles(document.getElementById(id));
}
function getAllStyles(elem) {
    if (!elem) return []; // Empty list if element is absent.
    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>

Dengan menggabungkan kaedah ini, kami fungsi boleh mengumpulkan semua gaya yang digunakan untuk elemen tertentu dengan berkesan, meningkatkan utilitinya untuk pelbagai tugas.

Atas ialah kandungan terperinci Bagaimana untuk Mendapatkan Semua Gaya Elemen Hanya Menggunakan IDnya?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!