JavaScript ฮ์ทเมล์ ดอม
- หน้าก่อน JS Async
- หน้าต่อไป วิธีเรียกใช้ DOM
ผ่าน HTML DOM จะสามารถเข้าถึงและเปลี่ยนแปลงทุกอิเลเมนต์ของเอกสาร HTML ได้
HTML DOM（โมเดลวัตถุเอกสาร）
เมื่อหน้าเว็บไซต์ถูกโหลด โปรแกรมบราวเซอร์จะสร้างโอปเปอร์เตอร์เดาต์เมนโอบเจกต์ของหน้าเว็บไซต์ (Document Object Model）。
HTML DOM โมเดลถูกจัดเรียงโดย:ต้นไม้วัตถุ:
ต้นไม้ DOM ของวัตถุ
ผ่านโอปเปอร์เตอร์นี้ JavaScript จะได้รับทุกกำลังในการสร้าง HTML ไดนามิก:
- JavaScript สามารถเปลี่ยนแปลงทุกอิเลเมนต์ HTML ในหน้าเว็บไซต์
- JavaScript สามารถเปลี่ยนแปลงทุกคุณสมบัติ HTML ในหน้าเว็บไซต์
- JavaScript สามารถเปลี่ยนแปลงทุกสไตล์ CSS ในหน้าเว็บไซต์
- JavaScript สามารถลบ HTML อิเลเมนต์และคุณสมบัติที่มีอยู่แล้ว
- JavaScript สามารถเพิ่ม HTML อิเลเมนต์และคุณสมบัติใหม่
- JavaScript สามารถตอบสนองต่อเหตุการณ์ HTML ที่มีอยู่แล้วในหน้าเว็บไซต์
- JavaScript สามารถสร้างเหตุการณ์ HTML ใหม่ในหน้าเว็บไซต์ได้
คุณจะเรียนรู้อะไร
ในบทบาทที่ต่อไปของตัวอย่างนี้ คุณจะเรียนรู้ถึง:
- จะเปลี่ยนแปลงเนื้อหาของ HTML อิเลเมนต์ได้อย่างไร
- วิธีเปลี่ยนแปลงรูปแบบองค์ประกอบ HTML (CSS)
- วิธีตอบสนองกับกิจกรรม HTML DOM
- วิธีการเพิ่มและลบองค์ประกอบ HTML
อะไรคือ DOM?
DOM คือมาตรฐาน W3C (World Wide Web Consortium)
DOM กำหนดมาตรฐานการเข้าถึงเอกสาร:
“W3C Document Object Model (DOM) คือแนวทางที่เปิดเสรีต่อการใช้งานและภาษา ที่อนุญาตให้โปรแกรมและสคริปต์เข้าถึง ปรับปรุงเนื้อหา โครงสร้างและรูปแบบของเอกสารโดยตรง”
มาตรฐาน W3C DOM ถูกแบ่งออกเป็นสามส่วนต่างกัน:
- Core DOM - โมเดลเอกสารทุกประเภท
- XML DOM - โมเดลเอกสาร XML มาตรฐาน
- HTML DOM - โมเดลเอกสาร HTML มาตรฐาน
อะไรคือ HTML DOM?
HTML DOM คือมาตรฐานของ HTMLวัตถุและมาตรฐานแบบการโปรแกรมมันกำหนด
- ในที่สุดวัตถุขององค์ประกอบ HTML
- ของทุกองค์ประกอบ HTMLคุณสมบัติ
- เข้าถึงทุกองค์ประกอบ HTMLวิธี
- ของทุกองค์ประกอบ HTMLกิจกรรม
ในทางตรงกันข้าม: HTML DOM คือมาตรฐานที่เกี่ยวกับวิธีการหา แก้ไข เพิ่มเติม หรือลบองค์ประกอบ HTML.
- หน้าก่อน JS Async
- หน้าต่อไป วิธีเรียกใช้ DOM
