Phương thức classList remove() trong JavaScript

• Bùi Tấn Lực
• 877
• 16/09/2025

Chức năng của Phương thức classList remove() trong JavaScript

Phương thức classList remove() trong JavaScript dùng để xóa một hoặc nhiều giá trị trong thuộc tính class trên phần tử HTML, phương thức này chỉ xóa giá trị chứ không xóa thuộc tính class.

Cú pháp của Phương thức classList remove() trong JavaScript

Xóa 1 giá trị

tenbien.classList.remove("giatri");

tenbien: Tên biến là phần tử HTML thường dùng document.getElementById("giá trị id") để lấy.

giatri: Giá trị của thuộc tính class.

Xóa nhiều giá trị

tenbien.classList.remove("giatri1", "giatri2",.....);

tenbien: Tên biến là phần tử HTML thường dùng document.getElementById("giá trị id") để lấy.

giatri1, giatri2,....: Nhiều giá trị của thuộc tính class.

Code Phương thức classList remove() trong JavaScript

Phương thức classList remove() một giá trị trong JavaScript

document.getElementById("pid").classList.remove("pclass");

<p id="pid" class="pclass" >Nội dung đã css</p>
<p>Click vào nút XÓA CLASS để xóa class pclass của phần tử HTML có id pid</p>
<button onclick="xoaClass()">XÓA CLASS</button>
<script>
function xoaClass() {
  // Lấy id pid và thực hiện hành động xóa class pclass
  document.getElementById("pid").classList.remove("pclass");
}
</script>

Chạy Thử

Phương thức classList remove() nhiều giá trị trong JavaScript

document.getElementById("pid").classList.remove("pclass","pclassbg","pclassc");

<p id="pid" class="pclass pclassbg pclassc" >Nội dung đã css</p>
<p>Click vào nút XÓA CLASS để xóa nhiều giá trị của class trên phần tử HTML có id pid</p>
<button onclick="xoaClass()">XÓA CLASS</button>
<script>
function xoaClass() {
  // Lấy id pid và thực hiện hành động xóa nhiều giá trị của class
  document.getElementById("pid").classList.remove("pclass","pclassbg","pclassc");
}
</script>

Chạy Thử

Lời kết

Cảm ơn các bạn đã tham khảo bài viết Phương thức classList remove() trong JavaScript.

Bùi Tấn Lực

Chia sẻ nội dung đánh giá của bạn về Phương thức classList remove() trong JavaScript
Email, Điện thoại của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *

Đăng ký tư vấn thiết kế website

Tìm hiểu 1 năm không bằng lắng nghe 1 câu tư vấn