JavaScript ialah bahasa pengaturcaraan berkuasa yang digunakan secara meluas dalam reka bentuk web untuk ciri unik dan fleksibelnya. Gaya ialah bahagian penting dalam reka bentuk web CSS (Cascading Style Sheet) ialah bahasa gaya yang biasa digunakan yang boleh menambah pelbagai kesan visual pada dokumen HTML. Walau bagaimanapun, kadangkala kita perlu memanipulasi gaya CSS melalui JavaScript, seperti mengalih keluar gaya CSS sesuatu elemen. Dalam artikel ini, kami akan memperkenalkan beberapa kaedah untuk mengalih keluar gaya CSS untuk reka bentuk web yang lebih sempurna.
Kaedah 1: Gunakan atribut classList
Atribut classList boleh menambah, mengalih keluar atau menukar satu atau lebih nama kelas dalam elemen. Kita boleh menggunakan atribut ini untuk mengosongkan nama kelas elemen dan mengalih keluar gaya yang sepadan. Berikut ialah contoh:
const element = document.getElementById("example"); element.classList.remove("classname");
Antaranya, const element = document.getElementById("example") mendapatkan elemen dengan id tertentu, dan kemudian element.classList.remove("classname") mengalih keluar elemen yang ditentukan dalam elemen khusus Nama kelas gaya nama kelas jelas.
Kaedah 2: Melalui atribut gaya
Kaedah lain yang biasa digunakan ialah menggunakan atribut gaya elemen. Sifat ini boleh digunakan untuk mencari sifat tertentu dalam lembaran gaya dan menetapkannya kepada nilai nol. Berikut ialah kod sampel:
const element = document.getElementById("example"); element.style.width = "";
Antaranya, const element = document.getElementById("example") mendapat elemen dengan id tertentu, dan kemudian element.style.width = "" menetapkan atribut lebar elemen kepada nilai NULL. Ini akan mengalih keluar gaya lebar pada elemen.
Kaedah 3: Melalui kaedah setAttribute
setAttribute() ialah kaedah DOM HTML yang boleh menetapkan atau menukar atribut yang ditentukan dan memberikannya nilai yang ditentukan. Dalam kes ini, kami akan mengalih keluar gaya CSS dengan menetapkan nilai sifat kepada rentetan kosong. Berikut ialah contoh kod:
const element = document.getElementById("example"); element.setAttribute("style", "");
Antaranya, const element = document.getElementById("example") mendapat elemen dengan id tertentu, dan kemudian element.setAttribute("style", "" ) menetapkan atribut gaya elemen ialah rentetan kosong. Ini akan mengalih keluar semua gaya CSS daripada elemen tertentu.
Kaedah 4: Melalui kaedah removeAttribute
Kaedah terakhir ialah menggunakan kaedah removeAttribute(), yang boleh memadamkan atribut yang ditentukan. Dalam kes ini, kami akan mengalih keluar gaya CSS menggunakan atribut gaya elemen yang telah dialih keluar. Berikut ialah kod sampel:
const element = document.getElementById("example"); element.removeAttribute("style");
Antaranya, const element = document.getElementById("example") mendapatkan elemen dengan id tertentu, dan kemudian element.removeAttribute("style") mengalih keluar atribut gaya elemen. Ini akan mengalih keluar semua gaya CSS daripada elemen itu.
Ringkasan
Dalam artikel ini, kami memperkenalkan empat kaedah JavaScript berbeza untuk mengalih keluar gaya CSS. Kaedah ini mempunyai ciri dan kegunaan yang berbeza, dan kita boleh memilih kaedah yang paling sesuai mengikut keperluan kita. Akhir sekali, kami amat mengesyorkan menggunakan kaedah JavaScript yang sesuai untuk memanipulasi gaya CSS dalam reka bentuk web untuk mencapai pengalaman pengguna yang lebih baik.
Atas ialah kandungan terperinci Bagaimana untuk mengalih keluar css daripada js. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!