Cách xóa lớp

Học cách sử dụng JavaScript để xóa tên lớp từ phần tử.

Nhấp vào nút để xóa một lớp từ đây!

Xóa lớp

Bước 1 - Thêm HTML:

Trong ví dụ này, chúng ta sẽ sử dụng một nút để từ id="myDIV" của phần tử <div> và xóa "mystyle" Loại:

<button onclick="myFunction()">Thử ngay</button>
<div id="myDIV" class="mystyle">
  This is a DIV element.
</div>

Bước 2 - Thêm CSS:

Đặt樣式 cho tên lớp được chỉ định:

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

Bước 3 - Thêm JavaScript:

Lấy id="myDIV" của phần tử <div> và xóa "mystyle" Loại:

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

Thử ngay

Trang liên quan

Hướng dẫn:Làm thế nào để thay đổi lớp

Hướng dẫn:Làm thế nào để thêm lớp

Hướng dẫn tham khảo:Thuộc tính classList của HTML DOM Element

Hướng dẫn tham khảo:Thuộc tính className của HTML DOM Element