บทนำสู่ DOM

• เมษายน 30, 2024

DOM เป็นตัวย่อสำหรับ Document Object Model เป็นวิธีการดู HTML ที่ทำให้นักพัฒนาเว็บไซต์สามารถสร้างฟังก์ชั่นและจัดการโค้ดในรูปแบบที่เป็นไปไม่ได้

DOM มีสามประเภทพื้นฐาน DOM หลักซึ่งสามารถใช้เพื่อกำหนดเอกสารใด ๆ โดยไม่คำนึงถึงประเภท XML DOM ซึ่งใช้กับเอกสาร XML และ HTML DOM ประเภทสุดท้ายนี้สำคัญที่สุดและมีประโยชน์สำหรับนักพัฒนา HTML ดังนั้นนั่นคือ DOM ที่บทความนี้จะสำรวจ

HTML DOM แบ่งหน้า HTML ออกเป็นโหนด โหนดเหล่านี้เชื่อมต่อกันด้วยโหนดชายด์ที่สืบทอดมาจากโหนดพาเรนต์และจากโหนดรูทที่ด้านบนในโครงร่างคล้ายต้นไม้ สิ่งที่ทำให้ DOM มีความสำคัญและมีประโยชน์สำหรับนักพัฒนา HTML คือคำจำกัดความนี้ทำให้ทุกส่วนของหน้าแตกต่างและตั้งอยู่ในส่วนที่เกี่ยวข้องกับส่วนอื่น ๆ ทั้งหมดเพื่อให้ง่ายต่อการออกแบบรหัสที่อ้างถึงส่วนนั้น ๆ . สิ่งนี้ทำให้ HTML DOM มีความสำคัญสำหรับการเขียนโปรแกรม Javascript เนื่องจากเป็นวิธีการให้โปรแกรม Javascript ใช้องค์ประกอบ HTML โดยตรง หากไม่มี DOM เป็นไปไม่ได้ที่โปรแกรม Javascript จะเข้าถึงเนื้อหาของหน้าเว็บแบบไดนามิก เป็นตัวอย่างหนึ่งโดยใช้วิธี DOM คุณสามารถเขียนโปรแกรมที่เปลี่ยนแปลงข้อความภายในองค์ประกอบ HTML เฉพาะหากมีเหตุการณ์เฉพาะเกิดขึ้น (เช่นผู้เข้าชมคลิกที่ปุ่มบนหน้า)

ดังที่คุณทราบแล้วหน้า HTML ประกอบด้วยองค์ประกอบต่าง ๆ ดังนี้:



ตัวอย่างหน้า HTML

นี่คือตัวอย่างของหน้า HTML พื้นฐาน

ด้วย DOM แต่ละองค์ประกอบ (ทุกสิ่งระหว่างชุดแท็กหนึ่งชุดเช่น) คือโหนด โหนดนี้เรียกว่าโหนดรูทและเป็นโหนดพื้นฐานที่สุด มันมีโหนดลูกสองโหนดและโหนด ในตัวอย่างด้านบนโหนดเป็นลูกของโหนดและ

node เป็นลูกของโหนด

นักพัฒนาเว็บสามารถใช้และแก้ไข DOM โดยใช้คำสั่งบางอย่าง คำสั่งเหล่านี้แบ่งออกเป็นคุณสมบัติ (ซึ่งอธิบายส่วนหนึ่งของหน้า HTML) และวิธีการ (ซึ่งทำบางสิ่งบางอย่างกับส่วนนั้นของหน้า)

สำหรับข้อมูลเฉพาะเกี่ยวกับวิธีใช้ DOM HTML ดูบทความถัดไป "การทำงานกับ DOM" ซึ่งจะโพสต์ในสัปดาห์หน้า

คำแนะนำวิดีโอ: vibration lecture 1 introduction to mechanical vibrations (เมษายน 2024).