Bagaimana untuk mengalih keluar Kelas CSS daripada Elemen Menggunakan JavaScript Asli?

Mengalih keluar Kelas CSS daripada Elemen dengan JavaScript Asli

Mengalih keluar kelas CSS daripada elemen HTML menggunakan JavaScript boleh dicapai tanpa bergantung pada ketiga- perpustakaan parti seperti jQuery. Di bawah ialah arahan langkah demi langkah:

1. Kenal pasti Elemen Sasaran:

Gunakan kaedah document.querySelector() untuk memilih elemen HTML yang anda mahu alih keluar kelas. Nyatakan ID elemen atau pengecam unik yang lain.

2. Gunakan Harta ClassList:

Pelayar moden menyokong harta classList pada setiap elemen. Sifat ini mewakili senarai kelas CSS yang digunakan pada elemen.

3. Alih keluar Kelas:

Untuk mengalih keluar kelas, hanya gunakan kaedah classList.remove() dan hantar nama kelas sebagai hujah. Contohnya:

const element = document.querySelector('#element');
element.classList.remove('red');

Contoh:

Coretan kod berikut menunjukkan cara mengalih keluar kelas CSS "merah" daripada elemen dalam praktikal senario:

const button = document.querySelector('#remove');
const element = document.querySelector('#el');

button.onclick = () => {
  element.classList.remove('red');
};

HTML:

<div>

CSS:

.red {
  background: red;
}

Apabila "Alih Keluar Kelas butang " diklik, kelas CSS "merah" akan dialih keluar daripada elemen, menukar warna latar belakangnya kepada lalai.

Atas ialah kandungan terperinci Bagaimana untuk mengalih keluar Kelas CSS daripada Elemen Menggunakan JavaScript Asli?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!