วิธี toggle() ของ HTML DOMTokenList

คำนิยามและวิธีใช้

วิธี toggle() ลบทิตี้ที่กำหนดออกจากบันทึกและกลับค่า false ถ้าไม่มีทิตี้นั้น จะเพิ่มทิตี้และกลับค่า true

ตัวอย่าง

ตัวอย่าง 1

เปลี่ยนความเปิดปิดของ "myStyle"

const list = element.classList;
list.toggle("mywStyle");

ทดลองด้วยตัวเอง

ตัวอย่าง 2

เพิ่มคลาส "myStyle" สู่องค์ประกอบ

const list = element.classList;
list.add("myStyle");

ทดลองด้วยตัวเอง

ตัวอย่าง 3

จากองค์ประกอบขององค์ประกอบ ลบคลาส "myStyle" ออก

const list = element.classList;
list.remove("myStyle");

ทดลองด้วยตัวเอง

ตัวอย่าง 4

เพิ่มชั้นหลายชั้นถึงองค์ประกอบ:

element.classList.add("myStyle", "anotherClass", "thirdClass");

ทดลองด้วยตัวเอง

ตัวอย่าง 5

ลบชั้นหลายชั้นจากองค์ประกอบ:

element.classList.remove("myStyle", "anotherClass", "thirdClass");

ทดลองด้วยตัวเอง

ตัวอย่าง 6

หาจำนวนชั้นขององค์ประกอบ:

let numb = element.classList.length;

ทดลองด้วยตัวเอง

ตัวอย่าง 7

เปลี่ยนชั้นหรือระดับเพื่อที่จะสร้างปุ่มด้านล่าง:

document.getElementById("myBtn").onclick = function() {myFunction()};
function myFunction() {
  document.getElementById("myDropdown").classList.toggle("show");
}

ทดลองด้วยตัวเอง

วลี

domtokenlist.toggle(token)

ตัวแปร

ตัวแปร คำอธิบาย
token สำคัญ ต้องการเปลี่ยนโซนุดคุณ

ค่าที่คืนค่า

ไม่มี

การสนับสนุนเบราเซอร์

domtokenlist.toggle() คือคุณสมบัติของ DOM Level 4 (2015)

มันได้รับการสนับสนุนจากทุกเบราเซอร์:

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
สนับสนุน สนับสนุน สนับสนุน สนับสนุน สนับสนุน

Internet Explorer 11 (หรือเก่ากว่า) ไม่สนับสนุน domtokenlist.toggle()

หน้าที่เกี่ยวข้อง

คุณสมบัติ length

วิธีแบบฟอร์ม item()

วิธีแบบฟอร์ม add()

วิธีแบบฟอร์ม remove()

วิธีแบบฟอร์ม replace()

วิธีแบบฟอร์ม forEach()

วิธีแบบฟอร์ม entries()

วิธีแบบฟอร์ม keys()

วิธีแบบฟอร์ม values()

DOMTokenList ออบเจก