Setelah membaca "metode implementasi untuk membuat atau menambahkan lembar gaya CSS secara dinamis dengan JavaScript", mudah bagi Anda untuk mencari cara memodifikasi lembar gaya CSS.
Saya kebetulan bertemu dengan seorang teman di forum hari ini yang menanyakan pertanyaan ini:
<tyle> .ls {width = 120px;} </style> <script> // Tambahkan kalimat di sini untuk mengubah nilai lebar .ls, cara menulisnya </script>Beberapa teman menjawab: "Jika ada banyak objek yang menggunakan .ls, itu benar -benar tidak nyaman untuk menggunakan JS, jQuery nyaman, $ (". Ls "). Lebar (200); tidak apa -apa."
Dia ingin menggunakan JQ's Class Selector.ls untuk memilih semua objek yang menggunakan gaya ini dan menyesuaikannya satu per satu, daripada mengubah lembar gaya CSS, jadi ada kekhawatiran tentang "banyak objek".
Tetapi masalahnya adalah bahwa ini hanya mengubah gaya ekspresi spesifik dari objek -objek tersebut, bukan pengaturan .ls. Jika elemen lain menggunakan gaya .ls muncul, itu akan tetap sama. Anda masih perlu menyesuaikan elemen ini lagi, untuk mengobati gejalanya tetapi bukan akar penyebabnya. Selain itu, metode ini juga menentukan bahwa tidak mungkin untuk mencapainya hanya dalam satu kalimat.
Ada beberapa orang yang memikirkan hal ini, dan jika Anda membaca artikel "metode implementasi untuk membuat atau menambahkan lembar gaya CSS secara dinamis dengan JavaScript", saya yakin Anda akan dengan mudah memikirkan cara menyelesaikan masalah ini dalam satu kalimat, yang merupakan ringkas dan efisien (browser secara otomatis akan mengatur ulang semua elemen yang menerapkan gaya ini), dan benar -benar memodifikasi gaya. Elemen yang baru ditambahkan yang menggunakan gaya ini akan secara otomatis menerapkan pengaturan yang dimodifikasi. Jadi, Anda telah belajar pengetahuan tingkat lebih tinggi yang dibedakan dari banyak orang. Izinkan saya menjelaskan metode ini secara rinci di bawah ini:
Karena contoh di atas, tidak mudah untuk melihat efeknya. Saya telah menulis contoh lain di bawah ini. Lebih mudah untuk melihat efeknya melalui perubahan warna:
<tyle> .theforever {width: 50px; color: red;}#forever {width: 150px; color: silver;} </style> <div> Seharusnya merah di sini, tetapi akan diubah kuning oleh js di bawah ini dengan mengubah pengaturan gaya css </div> <div id = "the forever"> Seharusnya peraknya. Memang, ini tidak akan berubah, hanya untuk perbandingan </div> <script> document.stylesheets [0] .csStext = document.stylesheets [0] .csstext.replace (/merah/g, "kuning"); // Bukankah tidak apa -apa? </script>Contoh di atas tidak ditujukan untuk nama gaya tertentu, tetapi warna umum (jika Anda memindahkannya langsung ke halaman CSS yang lebih kompleks dengan kata-kata merah yang tidak menunjukkan warna, ini juga dapat menyebabkan kesalahan. Saya selalu sangat jijik dengan penggunaan kode yang tidak berbasis otak dan tidak memberikan terlalu banyak instruksi), tetapi juga mudah untuk mengubahnya menjadi gaya gaya spesifik:
Dari yang di atas, kita dapat melihat dokumen itu. Jadi, jika Anda ingin mengubah pengaturannya untuk .ls, Anda hanya perlu menggunakan ".ls {width = 120px;}" sebagai bagian penggantian untuk mengganti dan ".ls {width = 555px;}" sebagai target penggantian, dan itu baik -baik saja.
Artikel di atas tentang cara memodifikasi lembar gaya CSS secara dinamis dengan JavaScript adalah semua konten yang saya bagikan dengan Anda. Saya harap ini dapat memberi Anda referensi dan saya harap Anda dapat mendukung wulin.com lebih lanjut.