Legacy DOM (DOM Level 0) เป็น DOM รุ่นแรก (Netscape 2/3, IE 3) ให้การเข้าถึงเฉพาะคอลเลกชันที่กำหนดไว้ล่วงหน้า ไม่สามารถเข้าถึง Element ทั่วไปได้ นี่คือคุณสมบัติหลัก:
ตารางคุณสมบัติ Document ของ Legacy DOM
| # | Property | คำอธิบาย | ตัวอย่าง | สถานะ |
|---|---|---|---|---|
| 1 | alinkColor | สีของ Link ที่ Active (กำลังถูกคลิก) - Deprecated ใช้ CSS :active แทน | document.alinkColor = "red" | Deprecated |
| 2 | anchors[] | Array ของ Anchor Objects (<a name="..."> หรือ <a id="...">) | document.anchors[0], document.anchors["top"] | Legacy (ใช้ document.querySelectorAll('a[id]')) |
| 3 | applets[] | Array ของ Applet Objects (<applet>) - Obsolete (Java Applet ตายแล้ว) | document.applets[0] | Obsolete |
| 4 | bgColor | สีพื้นหลังเอกสาร - Deprecated ใช้ CSS body { background-color } แทน | document.bgColor = "#ffffff" | Deprecated |
| 5 | cookie | String: อ่าน/เขียน Cookie ของเอกสาร - ยังใช้งานอยู่ | document.cookie = "session=abc" | Standard |
| 6 | domain | Domain ของเอกสาร (ใช้ Cross-frame Scripting) - ยังใช้งานอยู่ | document.domain = "example.com" | Standard |
| 7 | embeds[] | Array ของ Embedded Objects (<embed>) - Synonym ของ plugins[] | document.embeds[0] | Legacy (ใช้ document.querySelectorAll('embed')) |
| 8 | fgColor | สีข้อความพื้นฐาน - Deprecated ใช้ CSS color แทน | document.fgColor = "black" | Deprecated |
| 9 | forms[] | Array ของ Form Objects (<form>) - ยังใช้งานอยู่ (ส่วนหนึ่งของ HTML DOM) | document.forms[0], document.forms.login | Standard |
| 10 | images[] | Array ของ Image Objects (<img>) - ยังใช้งานอยู่ | document.images[0], document.images.logo | Standard |
| 11 | links[] | Array ของ Link Objects (<a href>, <area href>) - ยังใช้งานอยู่ | document.links[0] | Standard |
| 12 | location | Location Object (URL, Redirect) - ยังใช้งานอยู่ (ส่วนหนึ่งของ Window/Document) | document.location.href = "new.html" | Standard |
| 13 | plugins[] | Array ของ Plugin Objects (NPAPI Plugins - Obsolete, บราว์เซอร์ใหม่ลบออกแล้ว) | document.plugins[0] | Obsolete |
| 14 | referrer | Referrer URL - ยังใช้งานอยู่ | document.referrer | Standard |
| 15 | title | Title ของเอกสาร - ยังใช้งานอยู่ (ส่วนหนึ่งของ HTML DOM) | document.title = "New Title" | Standard |
| 16 | URL | URL ของเอกสาร (Read-only) - ยังใช้งานอยู่ | document.URL | Standard |
| 17 | vlinkColor | สี Link ที่ Visited แล้ว - Deprecated ใช้ CSS :visited แทน | document.vlinkColor = "purple" | Deprecated |
| 18 | lastModified | วันที่แก้ไขล่าสุด (จาก HTTP Header) - ยังใช้งานอยู่ | document.lastModified | Standard |
สรุป: คุณสมบัติไหนยังใช้ได้? ไหนต้องเลิกใช้?
| กลุ่ม | Properties | แนะนำ |
|---|---|---|
| ยังมาตรฐาน/ใช้ได้ | cookie, domain, forms[], images[], links[], location, referrer, title, URL, lastModified | ใช้งานได้ตามมาตรฐาน HTML DOM / W3C DOM |
| Deprecated (ใช้ CSS แทน) | alinkColor, bgColor, fgColor, vlinkColor, linkColor | ห้ามใช้ในโค้ดใหม่ ใช้ CSS (:link, :visited, :active, body { background, color }) |
| Obsolete (ลบออกแล้ว) | applets[], plugins[], embeds[] (ส่วนใหญ่) | Java Applet / NPAPI Plugin ตายแล้ว ใช้ <object>, <iframe>, WebAssembly แทน |
| Legacy Collections | anchors[], embeds[] | ใช้ document.querySelectorAll('a[id]'), document.querySelectorAll('embed') แทน |
ตัวอย่าง: ใช้ Legacy Properties ที่ยังคงมาตรฐาน
// Forms & Images - ยังดีและสะดวก
document.forms.login.elements.username.value = "user";
document.images.logo.src = "/new-logo.png";
// Cookie & Domain - จำเป็น
document.cookie = "theme=dark; max-age=31536000";
document.domain = "example.com"; // สำหรับ Subdomain Communication
// Referrer & LastModified - ข้อมูลเมตา
console.log("From:", document.referrer);
console.log("Updated:", document.lastModified);
ข้อสรุป: Legacy DOM ให้คอลเลกชันสำเร็จรูป (forms, images, links) ที่ยังคงเป็นมาตรฐานและสะดวก แต่คุณสมบัติทาง Presentation (Colors) และ Plugin/Applet ต้องเลิกใช้และเปลี่ยนไปใช้ CSS และ Modern Web APIs แทน