DOM คืออะไร

หากต้องการใช้ jQuery การรู้จัก DOM จะช่วยได้มากค่ะ ไม่ต้องกังวลนะคะ เป็นแนวคิดง่าย ๆ ที่มีชื่อฟังดูน่ากลัวเท่านั้นเอง 😊

DOM คือหน้าเว็บของคุณที่ถูกเปลี่ยนให้อยู่ในรูปต้นไม้ซึ่งประกอบด้วยส่วนต่าง ๆ — หัวเรื่อง ปุ่ม และรูปภาพทุกอย่างล้วนเป็นกิ่งก้านค่ะ

ลองนึกภาพต้นไม้ครอบครัวดูค่ะ 🌳 หน้าเว็บคือผู้ปกครอง และองค์ประกอบแต่ละอย่างที่อยู่ข้างในคือลูก สิ่งต่าง ๆ ซ้อนกันอย่างเป็นระเบียบค่ะ

DOM คือสิ่งที่โค้ดของคุณใช้สื่อสารด้วย หากต้องการเปลี่ยนปุ่ม คุณก็เข้าไปใน DOM แล้วเลือกปุ่มนั้นออกมาค่ะ

แต่ละส่วนเรียกว่าองค์ประกอบค่ะ ชื่อเรื่อง ย่อหน้า ลิงก์ — ทั้งหมดล้วนเป็นองค์ประกอบที่อยู่ในต้นไม้

หากต้องการเลือกองค์ประกอบ คุณจะใช้ตัวเลือก ซึ่งเปรียบเสมือนที่อยู่ที่ชี้ไปยังส่วนที่ต้องการได้อย่างแม่นยำค่ะ

นี่คือความมหัศจรรย์ค่ะ jQuery ทำให้การค้นหาองค์ประกอบใน DOM ง่ายมาก โค้ดนี้เลือกย่อหน้าทั้งหมดได้พร้อมกันค่ะ

เมื่อเลือกองค์ประกอบได้แล้ว คุณก็เปลี่ยนข้อความ สี หรือซ่อนองค์ประกอบนั้นได้ — อยากทำอะไรก็ทำได้เลยค่ะ

ดังนั้น DOM ก็คือหน้าเว็บ ส่วน jQuery คือวิธีง่าย ๆ ที่ช่วยให้คุณเข้าไปจัดการกับหน้าเว็บนั้น เป็นคู่ที่ลงตัวมากค่ะ! 🤝

ตอนนี้คุณเข้าใจ DOM และวิธีที่ jQuery ใช้งาน DOM แล้วค่ะ 🎉 ต่อไปเราจะดูว่าความรู้นี้ปรากฏในเว็บไซต์จริงอย่างไร