javascript - Bagaimana untuk melaksanakan JS untuk mengubah suai gaya global css secara dinamik
阿神
阿神 2017-05-19 10:11:38
0
3
632

Jika anda ingin mengubah suai gaya global css dalam halaman secara dinamik, contohnya, tukar warna semua fon pada halaman kepada merah
Ini boleh dicapai melalui css

*{color:red;}

Dan jika anda menggunakan butang pada halaman untuk mengubah suai gaya semua elemen melalui js, iaitu, klik butang melalui js untuk mengubah suai gaya semua elemen pada halaman secara dinamik supaya warna fon berwarna merah, bagaimanakah dilaksanakan

阿神
阿神

闭关修行中......

membalas semua(3)
阿神

Saya hanya boleh memikirkan kaedah ini.

Array.prototype.slice.call(document.all).forEach(function (ele) {
    ele.style.color = 'red';
});
阿神

Gunakan antara muka yang berkaitan dengan gaya css stylesheet.insertRule atau stylesheet.addRule, yang kedua-duanya boleh memasukkan gaya css secara dinamik Keserasian adalah baik dengan ie9+ stylesheet.insertRule或者stylesheet.addRule 这两个都可以动态插入css样式 兼容性还可以 ie9+

比如

    // https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleSheet/insertRule
    myStyle.insertRule("#blanc { color: white }", 0);

需要删除的时候还有deleteRuleremoveRule

Sebagai contoh🎜 rrreee 🎜Apabila anda perlu memadam, terdapat dua kaedah: deleteRule dan removeRule Anda boleh menyemak maklumat yang berkaitan🎜
phpcn_u1582

[].forEach.call(document.querySelectorAll('*'),function(a){
a.style.color = 'red';
})

Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan