DOM - Document Object Model

DOM (Document Object Model) er den levende model af en webside, som browseren bygger op i hukommelsen, når siden indlæses. Hvor HTML-koden er den statiske tegning, er DOM'en det færdige, manipulerbare hus — en trælignende struktur af alle sidens elementer, som JavaScript kan ændre i realtid uden at genindlæse hele siden.

Det er DOM'en, der gør moderne sider levende. Klikker du "læg i kurv", og tallet ved kurven straks tæller op, er det JavaScript, der har fundet det rette element i DOM'en og ændret det på stedet. Folder en menu sig ud, dukker en fejlbesked op under et felt, opdateres en pris — alt sammen ændringer i DOM'en.

Det foregår i grove træk i fire greb: man finder et element, ændrer dets tekst eller udseende, lytter efter handlinger som klik og scroll, og tilføjer eller fjerner elementer efter behov.

Hvorfor det er værd at kende — selv som ikke-tekniker

DOM-manipulation er ikke gratis: ændrer man for meget for ofte, kan en side blive tung og hakkende. Det er en stor del af grunden til, at moderne værktøjer som React og Angular bruger en "virtuel DOM" — en mellemregning, der samler ændringerne og kun rører den rigtige side, hvor det er nødvendigt. Resultatet mærker du som en hjemmeside, der føles hurtig og responsiv frem for træg. Det er kort sagt fundamentet under enhver interaktiv webapp.