Penggayaan CSS Dinamik dengan JavaScript
Mengawal penampilan elemen web secara dinamik ialah asas reka bentuk interaktif. Untuk mencapai matlamat ini, JavaScript menyediakan kaedah yang berkuasa untuk mengubah suai sifat CSS dengan cepat. Satu kes penggunaan biasa ialah untuk menogol keterlihatan elemen pada tuding.
Mari kita pertimbangkan contoh yang disediakan: satu siri div dengan div kiri yang dilegar mencetuskan div kanan untuk kelihatan. Untuk mencapai ini menggunakan JavaScript:
Berikut ialah skrip contoh:
const leftDivs = document.querySelectorAll(".left"); const rightDivs = document.querySelectorAll(".right1"); leftDivs.forEach((leftDiv) => { leftDiv.addEventListener("mouseover", () => { rightDivs[0].style.display = "block"; }); leftDiv.addEventListener("mouseout", () => { rightDivs[0].style.display = "none"; }); });
Secara ringkasan , dengan menggunakan pendengar acara dan JavaScript untuk memanipulasi sifat CSS, kami boleh mencipta interaksi dinamik yang meningkatkan pengalaman pengguna aplikasi web.
Atas ialah kandungan terperinci Bagaimanakah JavaScript Boleh Mengawal Penggayaan CSS Secara Dinamik untuk Reka Bentuk Web Interaktif?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!