W3C DOM -esittely

Henri Sivonen
fiMUGin ohjelmointikeittiö 28.6.–30.6.2002

Mikä se on?

• Dokumenttipuun olioesitys
• API HTML- ja XML-dokumenttien ohjelmalliseen käsittelyyn
• Kieliriippumaton
• W3C:n Suosituksia

Dokumenttipuun olioesitys

• HTML- ja XML-dokumentit jäsentyvät puiksi.
• Ohjelmointinäkökulmasta dokumentin tekstiesitys voidaan ajatella puun sarjallistetuksi muodoksi.

<root>
  <foo>
    <baz/>
  </foo>
  <foo/>
  <bar/>
</root>

Solmut

• Puu koostuu solmuista (Node).
• Solmuja ovat mm.
  • Elementit (Element)
  • Tekstisolmut (Text)
  • CDATA-osuudet (CDATASection)
  • Prosessointi-instruktiot (ProcessingInstruction)
  • Kommentit (Comment)

Suhteet naapureihin

• Solmusta on viittaukset ensimmäiseen (firstChild) ja viimeiseen (lastChild) lapseen, seuraavaan (nextSibling) ja edelliseen (previousSibling) sisareen ja isään (parentNode).
• firstChild ja nextSibling muodostavat binääripuunäkymän.
• Näkymä yleisenä puuna saadaan lapsisolmukokoelmista (childNodes).

Omat sisukset

• Myös attribuutit (Attr) ovat solmuja, mutta ne eivät näy sisaruus- ja vanhemmuussuhteissa.
• Elementtien attribuutit ovat kokoelmassa attributes.
• Mm. elementtien ja attribuuttien nimet näkyvät nodeName-kentässä.
• Joillain soluilla on arvo (nodeValue)
  • attribuutin arvo
  • tekstisolmun teksti
  • kommentin teksti
  • CDATA-osuuden teksti
  • Prosessointi-instruktion sisältö

API HTML- ja XML-dokumenttien ohjelmalliseen käsittelyyn

• Solmujen metodit
• Document-tehdas
• Kokoelmarajapinnat
• DOMException

Solmujen metodit

• insertBefore(Node new, Node ref)
• appendChild(Node new)
• replaceChild(Node new, Node old)
• removeChild(Node old)
• hasChildNodes()
• cloneNode(boolean deep)
• Elementeillä lisäksi metodit attribuuttilistan muokkaamiseen

Document-tehdas

• Dokumentin juurielementin parentNode
• Rajapinnoissa ei määritellä konstruktoreja, niinpä Document toimii tehtaana (factory design pattern) solmuille.
  • createFoo()-metodit
• Pitää saada käsiin jotenkin

Kokoelmarajapinnat

• NodeList (esim. childNodes on NodeList)
  • length
  • item(int index)
• NamedNodeMap (attributes on NamedNodeMap)
  • length
  • item(int index)
  • getNamedItem(DOMString name)
  • setNamedItem(Node n)
  • removeNamedItem(DOMString name)

DOMException

• Näitä lentää sieltä täältä, jos tekee jotain kiellettyä

Kieliriippumaton

• Määritelty IDL:llä ja englannilla
• Määrittelyssä mukana sidonnat Javalle ja ECMAScriptille
• Toteutettu myös muille kielille
  • PHP
  • Perl
  • Python
  • C
  • C++
  • Lingo

W3C:n Suosituksia

• Edellä käsitelty DOM Level 1 Corea.
  • W3C:n Suositukseksi lokakuussa 1998
  • Samassa Suosituksessa mukana DOM Level 1 HTML -mukavuusrajapinnat (X)HTML:lle
• DOM Level 2
  • Core
  • Events
  • Style
  • Views
  • Traversal and Range

DOM Level 1 HTML

• Erityisiä HTML:n ominaisuuksille viritettyjä mukavuusrajapintoja
• Lomakkeiden valintojen tilan tarkastelu
• Yleensä attribuutit näkyvät kenttinä
• Käytetään lähinnä selaimissa
• Myös MathML:llä ja SVG:lle on määritelty mukavuusrajapinnat

DOM Level 2 Core

• Nimiavaruustuki
• getElementById XML-puolelle (oli jo Level 1 HTML:ssä)
• Solmujen siirto omistajadokumenttien välillä

DOM Level 2 Events

• Tapahtumakäsittelijöiden liittäminen dokumenttiin
• Tapahtumienleviämismalli
• Tapahtumien liikkeelle laskeminen
• Implementaatiosta tulevat tapahtumat
  • Käyttöliittymätapahtumat
  • Mutaatiotapahtumat

DOM Level 2 Style (ja Views)

• Rajapinnat CSS-tyylimäärittelyjen käsittelyyn
• style-attribuutin arvon olioesitys
• getComputedStyle

Traversal and Range

• NodeIterator ja TreeWalker puun läpi iterointiin
• Saadaan dokumenttiolion toteuttamasta tehtaasta
• Käyttäjän implementoitava NodeFilter valikoitujen solmujen läpi iterointiin

Missä sitä voi käyttää?

• Serverillä
• Selaimissa
• Missä tahansa

Serverillä

• Kun XSLT ei riitä – integraatio muuhun ohjelmakoodiin
• Kun ei osaa XSLT:tä :-)
• Kun haluaa ohjelmoida itse operaatioita eikä yrittää esittää deklaratiivistä :-)

Selaimissa

• Ärsyttävät efektit (ei tätä :-)
• Selainpohjaiset käyttöliittymät serverillä pyöriviin sovelluksiin
• Selaimen kustomointi

Missä tahansa

• Erilaiset ohjelmat tarvitsevat tiedostomuotoja
• Tiedostomuodot voidaan määritellä XML:n sovelluksina
• XML-tiedostojen käsittely voidaan hoitaa DOM:illa (jos mahtuu muistiin)

Mistä lisää?

• http://www.w3.org/DOM/
• http://xml.apache.org/
• http://www.mozilla.org/docs/dom/
• Mozillassa Tools -> Web Development -> DOM Inspector