Bagaimanakah jQuery Boleh Digunakan untuk Menjana Secara Dinamik dan Menggunakan Peraturan CSS Boleh Digunakan Semula?

Mencipta Peraturan CSS Boleh Digunakan Semula Secara Dinamik dengan jQuery

Dalam aliran kerja CSS tradisional, gaya ditakrifkan dalam fail CSS statik. Walau bagaimanapun, jQuery menawarkan cara untuk mencipta peraturan CSS secara dinamik semasa masa jalan, menambah fleksibiliti dan menghapuskan keperluan untuk berbilang fail CSS statik.

Mencipta Peraturan CSS Lengkap:

Untuk mencipta peraturan CSS boleh guna semula lengkap menggunakan jQuery, langkah berikut boleh diambil:

1. Buat elemen gaya: Gunakan jQuery untuk mencipta elemen dan tambahkannya pada bahagian dokumen.

$("<style type='text/css'>").appendTo("head");

2. Tentukan peraturan CSS: Di dalam elemen gaya, gunakan kaedah .text() jQuery untuk mentakrifkan peraturan CSS.

$("style").text(".redbold{ color:#f00; font-weight:bold;}");

3. Gunakan peraturan: Gunakan Kaedah .addClass() jQuery untuk menggunakan peraturan CSS yang baru dibuat pada elemen.

$("<div/>").addClass("redbold").text("SOME NEW TEXT").appendTo("body");

Contoh:

Contoh berikut menunjukkan cara mencipta dan gunakan peraturan CSS yang menetapkan warna fon kepada merah dan berat fon kepada tebal:

$("").appendTo("head");
$("<div/>").addClass("redbold").text("SOME NEW TEXT").appendTo("body");

Kod ini mencipta elemen gaya, mentakrifkan peraturan CSS .redbold dan menggunakannya pada