DOM

Från Webbling
Hoppa till: navigering, sök

DOM står för ”Document Object Model”. Det är är en standard för hur man ska kunna interagera med ett HTML-dokument i en webbläsare, t.ex. ifrån skript. När webbläsaren läser in din webbsida så kommer den att tolka den och bygga upp en egen intern datastruktur som representerar sidan. När vi jobbar med JavaScript vill vi kunna gå in och ändra i denna interna datastruktur. Eftersom olika webbläsare förstås handhar den tolkade webbkoden på olika sätt, så har man skapat en standard med vilken man kan komma åt den interna representationen av sidan på ett enhetligt vis. Oavsett vilken webbläsare du använder, bör DOM-åtkomsten fungera likvärdigt. I alla fall är det så i idealfallet, det faktiskt förekommer tyvärr fortfarande en del avvikelser mellan de olika webbläsarna (detta kan man delvis lösa genom att använda sig av hjälpbibliotek såsom t.ex. jQuery – som är ett av de vanligaste tilläggsbiblioteken för JavaScript).

Webbdatan är i DOM uppbyggt som en trädstruktur, de olika underelementen bildar grenar till föräldraelementen. De flesta webbläsare har, ofta inbyggda, utvecklingsverktyg som kan visa en DOM-representation för den aktiva sidan.

Det finns många inbyggda funktioner i webbläsarnas JavaScript som möjliggör sökning i och manipulation av DOM. Det finns även olika tilläggsbibliotek som tillhandahåller fler metoder för dessa syften. I många fall förenklar de även processen genom vilken man arbetar mot DOM. Tidigare var det nästan tvunget att använda sådana extrabibliotek, då det inte fanns någon bra standard i JavaScript för DOM-manipulation. Olika tillverkare tillhandahöll olika metoder och i vissa fall hade man annorlunda beteende på metoder trots att de hade samma namn. Idag är situationen mycket bättre. Man har lyckats standardisera metodanropen för DOM på ett bra och enhetligt vis. Det kan dock fortfarande vara enklare och mer enhetligt att använda något tillägg såsom t.ex. jQuery. Vi har en egen sektion för jQuery här på Webbling. Om du vill veta mer om hur man använder ”plain JavaScript” för att hantera DOM, rekommenderas att du läser; "A Dive Into Plain JavaScript".