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
element.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ử:
<p id="elem" class="www ggg zzz"></p>
let elem = document.querySelector('#elem');
elem.classList.toggle('zzz');
Kết quả thực thi mã:
<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ử:
<p id="elem" class="www ggg"></p>
let elem = document.querySelector('#elem');
elem.classList.toggle('zzz');
Kết quả thực thi mã:
<p id="elem" class="www ggg zzz"></p>
Xem thêm
-
phương thức
classList.add,
thêm lớp đã chỉ định -
phương thức
classList.remove,
xóa lớp đã chỉ định -
phương thức
classList.contains,
kiểm tra lớp đã chỉ định
