ข้อยกเว้นในการทำงานกับแอตทริบิวต์ใน JavaScript

ในการทำงานกับแอตทริบิวต์ มีข้อยกเว้นหนึ่ง - นั่นคือแอตทริบิวต์ class คำนี้เป็นคำพิเศษใน JavaScript ดังนั้นเราไม่สามารถเขียนแค่ elem.class เพื่ออ่านค่าของแอตทริบิวต์ class ได้ แทนที่เราควรเขียนเป็น elem.className

มาดูตัวอย่างกัน สมมติว่าเรา มีอินพุตแบบนี้:

<input id="elem" class="aaa bbb">

ลองแสดงค่าของแอตทริบิวต์ class สำหรับอินพุตของเราดู:

let elem = document.querySelector('#elem');
console.log(elem.className); // จะได้ 'aaa bbb'

ยังมีข้อยกเว้นอื่น ๆ อีก เช่น แอตทริบิวต์ for ควรอ้างถึงผ่าน htmlFor

มี div:

<div id="elem" class="content no-gap"></div>

มีปุ่มด้วย เมื่อคลิกที่ปุ่ม ให้อ่าน และแสดงค่าของแอตทริบิวต์ class ของ div ของเราบนหน้าจอ

มี div:

<div id="elem"></div>

มีปุ่มด้วย เมื่อคลิกที่ปุ่ม ให้เขียน คลาสใด ๆ ลงในแอตทริบิวต์ class ของ div ของเรา

มี div ที่มีคลาส CSS หลายคลาส คั่นด้วย ช่องว่าง:

<div id="elem" class="aaa bbb ccc"></div>

มีปุ่มด้วย เมื่อคลิกที่ปุ่ม ให้รับ อาร์เรย์ของคลาส CSS ของ div ของเรา