DOM (Document Object Model) se kreira u trenutku kada se web stranica učita od strane Internet preglednika. Sa DOM-om i JavaScript-om je moguće kreirati dinamički HTML sadržaj, mijenjati HTML elemente i atrubute na web stranici, CSS stilove, uklanjati ili dodavati HTML elemente i atribute, te kreirati ili djelovati na HTM događaje.
DOM je standard koji dopušta pritup i izmjenama sadržaja web stranica, strukture i stila HTML dokumenata. Ovaj standard se dijeli na 3 dijela:
- Core DOM – model za sve tipove dokumenata
- XML DOM – model za XML dokumente
- HTML DOM – model za HTML dokumente
HTML DOM
HTML DOM je standardni objektni model i programersko sučelje za HTML koji definira:
- HTML elemente kao objekte
- svojstva – vrijednosti HTML elemenata koje možete mijenjati ili očitati
- metode – akcije na HTML elementima
- događaje za HTML elemente
HTML DOM Programming Interface
HTML DOM-u se može pristupiti JavaScript-om i drugim programskim jezicima. Svi HTML elementi se definiraju kao objekti.
Metod getElementById
Da bi se pristupilo nekom HTML elementu najčešće se koristi id elementa.
Primjer izmjene sadržaja elementa <p> uz pomoć id=”demo”
<html>
<body><p id="demo"></p>
<script>document.getElementById("demo").innerHTML = "Hello World!";
</script></body>
</html>
U ovom primjeru getElementById je method, dok je innerHTML property.
Svojstvo innerHTML
Najlakši način dobivanja vrijednosti elementa je upotrebom innerHTML svojstva, a ovo se često koristi za dobijanje vrijednosti ili zamjene sadržaja HTML elemenata. Sa innerHTML je moguće mijenjati bilo koji HTML element uključujući i <html> i <body>.