Document Object Model

DOM je platformovo aj jazykovo neutrálny interface, ktorý dovoľuje programom a scriptom dynamický prístup a obnovovanie nejakého obsahu dát, štruktúr a štýlov v dokumente. DOM obsahuje štandardnú množinu objektov pre reprezentáciu HTML a XML dokumentov, štandardný model ako ich môžeme zkombinovať a štandardný interface pre manipuláciu a prístup k nim. Skladá sa z dvoch častí:

-HTML
-Core

DOM je vlastne API(Application programing interface) pre platné HTML a dobre vztvorené XML. Definuje logickú štruktúru celého dokumentu a ako je možné k nim pristupovať. S DOM programátor môže vytvárať dokumenty, prechádzať cez ich štruktúru a vytvárať, modifikovať, alebo mazať objekty alebo textový obsah dokumentu. Teda všetko, čo nájdeme v HTML alebo v XML dokumente je prístupné, môže byť modifikované, alebo zmazané. DOM predstavuje štandardný interface, ktorý je možné použiť v širokej škále prostredí a aplikácií. Je robený tak, aby mohol byť použitý v akomkoľvek programovacom jazyku.
CORE -obsahuje základné interfacy,ktoré môžu reprezentovať hocijaký štrukturovaný dokument a taktiež rozšírené interfacy pre reprezentáciu XML dokumentov. Napríklad klasický HTML kód :

<table>
  <tbody>
   <tr>
   <td> jedna </td>
   <td> dve </td>
  </tr>
   <tr>
   <td> tri<td>
  </tr>
 </tbody>
</table>

vyzerá v DOM nasledovne:


Každý dokument podľa DOM má štruktúru stromu, aj ked DOM priamo nehovorí, že dokument musí byť implementovaný ako strom, ani nešpecifikuje vzťahy medzi objektami- teda môže byť naimplementovaný ktorýmkoľvek spôsobom.
Jednou z jeho vlastností je izomorfizmus: Ak sú použité dve DOM implementácie na vytvorenie toho istého dokumentu, tak ide o ten istý model s rovnakými objektami a vzťahmi.

DOM nedefinuje sémantiku HTML alebo XML. DOM je model programovania vytvorený pre dodržiavanie tejto sémantiky. Hovorí, že každý dokument napísaný v HTML alebo XML môže byť reprezentovaný v DOM.

DOM Core Level 1 Definuje minimálnu množinu objektov pre manipuláciu a prístup k objektom dokumentu.

DOM Structure Model Predstavuje DOM ako hierarchiu uzlových objektov, ktoré implementujú špeciálne interfacy. Niektoré uzly môžu mať potomkov, iné sú ako listy- nemôžu mať už pod sebou žiadnych potomkov. Napríklad Text-nemôže mať potomkov, ale napríklad Atribút môže mať ako potomka Text alebo Referenciu na Entitu.

Zoznam typov uzlov a akých môžu mať potomkov:

Document -- Element (maximálne jeden ), ProcessingInstruction ,Comment, DocumentType (maximálne jeden )
DocumentFragment-- Element , ProcessingInstruction ,Comment , Text , CDATASection , EntityReference
DocumentType -- no children
EntityReference -- Element , ProcessingInstruction , Comment , Text , CDATASection , EntityReference
Element -- Element, Text , Comment , ProcessingInstruction , CDATASection , EntityReference
Attr -- Text , EntityReference
ProcessingInstruction -- no children
Comment -- no children
Text -- no children
CDATASection -- no children
Entity -- Element , ProcessingInstruction , Comment , Text, CDATASection , EntityReference
Notation -- no children


NodeList - uchováva poradie NODOV, ich potomkov a rodičov. Na nom sú implemetované funkcie ako napríklad firstChild, ktorá vráti prvého potomka alebo GetElementByTagName(vráti element s daným TagName). Hierarchická štruktúra sa začína slovom 'document', ktoré označuje aktuálu stránku a jej obsah. Napríklad je pod documentom. potom nasleduje atď.

Príklad výpisu pomocou DOM:


Toto je <b>tučný</b> text.


V DOM:

text1=document.CreateTextNode("Toto je");
bTag=document.CreateElement("b");
textB=document.CreateTextNode("tučný");
text2=document.CreateTextNode("text");
bTag=appendChild(textB);
document.body.appendChild(text1);
document.body.appendChild(bTag);
document.body.appendChild(text2);

HTML DOM-rozširuje Core, opisuje metódy a objekty špecifické pre HTML.Zatiaľ čo Core slúži pre manipuláciu v hierarchickom modeli, v HTML DOM je fukčnosť závislá na špeciálnych elementoch definovaných v HTML. Odhaľuje viac metód a vlastností konzistentných s už existujúcim modelom.


Priklady:

Text
Formular
Tabulka
Menu

Zdroje a materialy:

[pdf]   W3C DOM Specification
[html] W3C DOM Technical Reports
[img]   Interfaces
[img]   Core Level 1
[img]   Core Level 2