## Bagaimana untuk Mengubah Suai Peraturan CSS dengan JavaScript Tanpa Penggayaan Sebaris?

Mengubah suai Peraturan CSS dengan JavaScript Tanpa Penggayaan Sebaris

Adakalanya perlu untuk mengubah suai pengisytiharan CSS secara dinamik tanpa menggunakan penggayaan sebaris. Pertimbangkan contoh berikut:

<code class="html"><style>
    .box {color:green;}
    .box:hover {color:blue;}
</style>

<div class="box">TEXT</div></code>

Ini menghasilkan kotak biru yang bertukar hijau semasa tuding. Walau bagaimanapun, penggayaan sebaris boleh mengatasi gelagat ini:

<code class="html"><div class="box" style="color:red;">TEXT</box></code>

Dalam kes ini, kotak akan sentiasa berwarna merah, tanpa mengira keadaan tuding.

Untuk mengelakkan isu ini, anda boleh mengubah suai Objek pengisytiharan CSS secara langsung. Begini caranya:

<code class="javascript">var sheet = document.styleSheets[0];
var rules = sheet.cssRules || sheet.rules;

rules[0].style.color = 'red';</code>

Perhatikan bahawa Internet Explorer menggunakan peraturan dan bukannya cssRules.

Berikut ialah demo: [Fiddle](http://jsfiddle.net/8Mnsf/1/)

Atas ialah kandungan terperinci ## Bagaimana untuk Mengubah Suai Peraturan CSS dengan JavaScript Tanpa Penggayaan Sebaris?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!