Mengapakah Perubahan JavaScript Saya Tidak Mempengaruhi CSS Saya :root Variables?

Menukar CSS :root Color Variables dengan JavaScript

Seorang pengguna bertujuan untuk melaksanakan sistem yang mengubah tema halaman web dengan melaraskan pembolehubah warna ditakrifkan dalam bahagian :root CSS. Walaupun melaksanakan kod JavaScript untuk menetapkan tema, tiada perubahan diperhatikan.

Kod yang disediakan cuba menukar --main-color pembolehubah, tetapi ia tidak menggunakan sintaks yang betul. Cara yang betul untuk mengubah suai :root variables dalam JavaScript menggunakan kaedah document.documentElement.style.setProperty(). Baris berikut harus ditambahkan pada kod JavaScript:

document.documentElement.style.setProperty('--main-color', '#YOURCOLOR');

Di mana #YOURCOLOR mewakili nilai warna yang dikehendaki. Contohnya, untuk menetapkan warna utama kepada biru, baris berikut harus digunakan:

document.documentElement.style.setProperty('--main-color', '#0000FF');

Dengan memasukkan baris ini ke dalam kod JavaScript, pengguna akan dapat menukar pembolehubah warna :root secara dinamik, membenarkan mereka menyesuaikan tema halaman web mereka.

Atas ialah kandungan terperinci Mengapakah Perubahan JavaScript Saya Tidak Mempengaruhi CSS Saya :root Variables?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!