Bagaimanakah saya boleh mengalih keluar Kelas CSS daripada Elemen Menggunakan JavaScript Tulen?

Hapuskan Kelas CSS daripada Elemen dengan JavaScript Tulen

Dalam bidang pembangunan web, tugas mengalih keluar kelas CSS daripada elemen tanpa menggunakan jQuery sering timbul. Pencarian ini memerlukan pemahaman yang menyeluruh tentang keupayaan JavaScript.

Pendekatan Moden: Senarai Kelas untuk Penyelamat

Untuk mencapai objektif ini dengan cara yang mematuhi piawaian web semasa, harta classList bersinar sebagai kaedah pilihan. Disokong oleh majoriti penyemak imbas utama, atribut ini menyediakan cara langsung untuk memanipulasi kelas.

Pelaksanaan dalam Tindakan

Untuk menggambarkan penggunaan classList, pertimbangkan kod berikut coretan:

ELEMENT.classList.remove("CLASS_NAME");

Berikut ialah contoh untuk diberikan lebih lanjut kejelasan:

<div>
<pre class="brush:php;toolbar:false">function remove() {
  const el = document.querySelector('#el');
  el.classList.remove("red");
}

remove.onclick = () => {
  remove();
};

Dalam kod ini, fungsi remove() menggunakan classList.remove() untuk menghapuskan kelas "merah" daripada elemen dengan ID el. Apabila mengklik butang dengan ID dialih keluar, tindakan ini dicetuskan, mengakibatkan pengalihan keluar gaya CSS yang sepadan.