Phương thức toggle của đối tượng classList

Phương thức toggle của đối tượng classList luân phiên lớp CSS đã chỉ định của phần tử: thêm lớp nếu nó không có và xóa nếu nó đã tồn tại.

Cú pháp

javascriptelement.classList.contains(class);

Ví dụ

Trong ví dụ này, khi sử dụng phương thức toggle, lớp zzz sẽ bị xóa vì nó đã có trong phần tử:

html<p id="elem" class="www ggg zzz"></p>

javascriptlet elem = document.querySelector('#elem');
elem.classList.toggle('zzz');

Kết quả thực thi mã:

html<p id="elem" class="www ggg"></p>

Ví dụ

Trong ví dụ này, khi sử dụng phương thức toggle, lớp zzz sẽ được thêm vào vì nó chưa có trong phần tử:

html<p id="elem" class="www ggg"></p>

javascriptlet elem = document.querySelector('#elem');
elem.classList.toggle('zzz');

Kết quả thực thi mã:

html<p id="elem" class="www ggg zzz"></p>

Xem thêm