Bagaimana untuk Menambah dan Memohon Kelas CSS Secara Dinamik Menggunakan JavaScript?

Cara Mencipta dan Menggunakan Kelas CSS secara Dinamik dalam JavaScript

Mencipta kelas CSS dalam JavaScript secara dinamik memberikan fleksibiliti dan kawalan ke atas penampilan elemen HTML. Langkah berikut menggariskan cara untuk mencapai ini:

1. Buat Elemen:

var style = document.createElement('style');

2. Tetapkan Jenis dan InnerHTML:

style.type = 'text/css';
style.innerHTML = '.cssClass { color: #f00; }';

3. Tambahkan Gaya pada :

document.getElementsByTagName('head')[0].appendChild(style);

4. Gunakan Kelas pada Elemen HTML:

document.getElementById('someElementId').className = 'cssClass';

Contoh:

var style = document.createElement('style');
style.type = 'text/css';
style.innerHTML = '.myClass { color: blue; }';
document.getElementsByTagName('head')[0].appendChild(style);

document.getElementById('myElement').className = 'myClass';

Kod ini mencipta kelas CSS dipanggil "myClass" dengan teks biru dan gunakannya pada elemen HTML dengan ID "myElement."

Nota:

Kaedah ini tidak terhad kepada elemen HTML; ia juga boleh digunakan pada kawalan ASP.NET seperti asp:Textbox, asp:Dropdownlist dan asp:Datalist.

Atas ialah kandungan terperinci Bagaimana untuk Menambah dan Memohon Kelas CSS Secara Dinamik Menggunakan JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!