Bagaimanakah saya boleh menukar peraturan kelas CSS secara dinamik dalam masa nyata dengan jQuery?

Tukar Peraturan Kelas CSS Secara Dinamik dengan jQuery

Pertanyaan anda melibatkan dua aspek:

1. Mengubah suai Peraturan Kelas dalam Masa Nyata

jQuery sahaja tidak boleh mengubah peraturan kelas CSS secara dinamik. Walau bagaimanapun, anda boleh menggunakan sifat StyleSheets objek dokumen untuk mengakses peraturan CSS secara langsung.

Kod:

<code class="javascript">document.getElementById("button").onclick = function() {
    var ss = document.styleSheets;

    for (var i = 0; i < ss.length; i++) {
        var rules = ss[i].cssRules;
        for (var j = 0; j < rules.length; j++) {
            if (rules[j].selectorText === ".classname") {
                rules[j].style.fontSize = "20px";
            }
        }
    }
};</code>

2. Menyimpan Perubahan Kelas pada Fail

Untuk menyimpan perubahan kelas pada fail, anda perlu mengekstrak peraturan CSS dan menghantarnya ke pelayan melalui permintaan Ajax. Pelaksanaan sebelah pelayan melibatkan mencipta atau mengemas kini fail dengan peraturan yang diubah suai.

Nota Tambahan:

• Untuk keserasian IE6, gunakan document.styleSheets dan bukannya document.styleSheets.
• Untuk mendapatkan peraturan CSS, akses sifat peraturan objek helaian gaya.
• Gunakan sifat cssText untuk menetapkan atau mengubah suai peraturan CSS.

Rujukan:

• document.styleSheets (Mozilla): https://developer.mozilla.org/en-US/docs/Web/API/Document/styleSheets
• styleSheet Object (Mozilla): https://developer.mozilla.org/en-US/docs/Web/API/StyleSheet
• CssRule Object (Mozilla): https://developer.mozilla .org/en-US/docs/Web/API/CSSRule
• document.styleSheets (MSDN): https://docs.microsoft.com/en-us/previous-versions/windows/internet-explorer /ie-developer/dom/document.stylesheets
• CssRule Object (MSDN): https://docs.microsoft.com/en-us/previous-versions/windows/internet-explorer/ie-developer/ dom/cssrule

Atas ialah kandungan terperinci Bagaimanakah saya boleh menukar peraturan kelas CSS secara dinamik dalam masa nyata dengan jQuery?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!