Némiképp leegyszerűsítve a DOM (Document Object Model, magyarul Dokumentum Objektum Modell) a HTML-kód azon formája, amelyet a JavaScript képes olvasni és módosítani.

Kicsit pontosabban megfogalmazva: amikor a böngésző betölt egy weboldalt, akkor beolvassa a HTML-kódot, és elkészíti belőle a DOM-ot, azaz a HTML-kód objektumokból felépített reprezentációját. A DOM lehetővé teszi, hogy a JavaScript módosítsa a weboldal tartalmát, struktúráját vagy akár stílusát is.

Hogy el tudd képzelni a DOM-ot, itt egy egyszerű példa. Ez a HTML-kód, amelyet te látsz:

Ez pedig a DOM „fa” (DOM tree), amelyet a böngésző épít a JavaScript számára:

Megjegyzés: A node magyarul csomópontot jelent, de a programozásban nem szoktuk lefordítani.

A node-ok az egyes HTML-elemeknek és azok esetleges tartalmának felelnek meg. Mindegyik egy-egy objektum (object), és ennek megfelelően rendelkezik tulajdonságokkal (properties) és metódusokkal (methods). Ezeket felhasználva tudod majd JavaScripttel manipulálni, azaz módosítani magát a DOM-ot.

Ha mindez érthető, akkor kérlek, válaszold meg az alábbi kérdést