Bagaimana untuk tukar kelas

Gunakan JavaScript untuk menambahkan dan menghapus kelas di antara elemen.

Klik tombol untuk tukar nama kelas!

Tukar kelas

Langkah pertama - Tambahkan HTML:

diambil untuk menambahkan kelas: id="myDIV" tukar kelas di antara elemen div (dalam contoh ini, kami menggunakan tombol untuk tukar nama kelas).

<button onclick="myFunction()">Cuba</button>
<div id="myDIV">
  Ini adalah elemen DIV.
</div>

Langkah kedua - Tambahkan CSS:

Tambahkan nama kelas untuk tukar:

.mystyle {
  width: 100%;
  padding: 25px;
  background-color: coral;
  color: putih;
  font-size: 25px;
}

Langkah ketiga - Tambahkan JavaScript:

ambil id="myDIV" element <div> dan di "mystyle" Tukar kelas di antara:

function myFunction() {
  var element = document.getElementById("myDIV");
  element.classList.toggle("mystyle");
}

Cuba sendiri

Halaman berkaitan

Mentor:Bagaimana menambahkan kelas

Mentor:Bagaimana menghapus kelas

Reference manual:HTML DOM Element classList properti