วิธี toggle ของวัตถุ classList

วิธี toggle ของวัตถุ classList สลับคลาส CSS ที่กำหนดขององค์ประกอบ: เพิ่มคลาส ถ้าไม่มี และลบออกถ้ามี

ไวยากรณ์

javascriptelement.classList.contains(class);

ตัวอย่าง

ในตัวอย่างนี้ เมื่อใช้วิธี toggle แล้ว คลาส zzz จะถูกลบออก เนื่องจาก มีอยู่แล้วในองค์ประกอบ:

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

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

ผลลัพธ์จากการรันโค้ด:

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

ตัวอย่าง

ในตัวอย่างนี้ เมื่อใช้วิธี toggle แล้ว คลาส zzz จะถูกเพิ่ม เนื่องจาก ไม่มีในองค์ประกอบ:

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

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

ผลลัพธ์จากการรันโค้ด:

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

ดูเพิ่มเติม