วิธี toggle ของวัตถุ classList
วิธี toggle ของวัตถุ classList
สลับคลาส CSS ที่กำหนดขององค์ประกอบ: เพิ่มคลาส
ถ้าไม่มี และลบออกถ้ามี
ไวยากรณ์
element.classList.contains(class);
ตัวอย่าง
ในตัวอย่างนี้ เมื่อใช้วิธี
toggle แล้ว คลาส zzz จะถูกลบออก เนื่องจาก
มีอยู่แล้วในองค์ประกอบ:
<p id="elem" class="www ggg zzz"></p>
let elem = document.querySelector('#elem');
elem.classList.toggle('zzz');
ผลลัพธ์จากการรันโค้ด:
<p id="elem" class="www ggg"></p>
ตัวอย่าง
ในตัวอย่างนี้ เมื่อใช้วิธี
toggle แล้ว คลาส zzz จะถูกเพิ่ม เนื่องจาก
ไม่มีในองค์ประกอบ:
<p id="elem" class="www ggg"></p>
let elem = document.querySelector('#elem');
elem.classList.toggle('zzz');
ผลลัพธ์จากการรันโค้ด:
<p id="elem" class="www ggg zzz"></p>
ดูเพิ่มเติม
-
วิธี
classList.add,
ซึ่งเพิ่มคลาสที่กำหนด -
วิธี
classList.remove,
ซึ่งลบคลาสที่กำหนด -
วิธี
classList.contains,
ซึ่งตรวจสอบคลาสที่กำหนด
