- Asiakirjan objekti
- Dokumenttiobjektin ominaisuudet
- Dokumenttiobjektin menetelmät
- Esimerkki asiakirjaobjektista
The dokumenttiobjekti edustaa koko html-asiakirjaa.
Kun html-dokumentti ladataan selaimeen, siitä tulee dokumenttiobjekti. Se on juurielementti joka edustaa html-asiakirjaa. Sillä on ominaisuuksia ja menetelmiä. Dokumenttiobjektin avulla voimme lisätä verkkosivullemme dynaamista sisältöä.
Kuten aiemmin mainittiin, se on ikkunan kohde. Niin
window.document
On sama kuin
document
W3C:n mukaan - 'W3C Document Object Model (DOM) on alusta- ja kielineutraali käyttöliittymä, jonka avulla ohjelmat ja komentosarjat voivat dynaamisesti käyttää ja päivittää asiakirjan sisältöä, rakennetta ja tyyliä.'
Dokumenttiobjektin ominaisuudet
Katsotaanpa asiakirjaobjektin ominaisuuksia, joita asiakirjaobjekti voi käyttää ja muokata. 
Dokumenttiobjektin menetelmät
Voimme käyttää ja muuttaa asiakirjan sisältöä sen menetelmillä.
Tärkeät asiakirjaobjektin menetelmät ovat seuraavat:
| Menetelmä | Kuvaus |
|---|---|
| kirjoittaa ('merkkijono') | kirjoittaa annetun merkkijonon asiakirjaan. |
| writeln('merkkijono') | kirjoittaa annetun merkkijonon asiakirjaan rivinvaihdolla sen lopussa. |
| getElementById() | palauttaa elementin, jolla on annettu id-arvo. |
| getElementsByName() | palauttaa kaikki elementit, joilla on annettu nimiarvo. |
| getElementsByTagName() | palauttaa kaikki elementit, joilla on annettu tunnisteen nimi. |
| getElementsByClassName() | palauttaa kaikki elementit, joilla on annettu luokan nimi. |
Kentän arvon käyttäminen dokumenttiobjektin mukaan
Tässä esimerkissä saamme syötetyn tekstin arvon käyttäjän mukaan. Tässä meillä on käytössä asiakirja.lomake1.nimi.arvo saadaksesi nimikentän arvon.
Tässä, asiakirja on juurielementti, joka edustaa html-asiakirjaa.
muoto1 on lomakkeen nimi.
nimi on syötetyn tekstin attribuutin nimi.
arvo on ominaisuus, joka palauttaa syötetyn tekstin arvon.
Katsotaanpa yksinkertainen esimerkki dokumenttiobjektista, joka tulostaa nimen tervetuloviestillä.
function printvalue(){ var name=document.form1.name.value; alert('Welcome: '+name); } Enter Name: