DOM – dokumentobjektsmodellen
Förstå DOM som webbläsarens programmerbara representation av HTML-dokumentet. Genomgången kopplar webbstandarder och utvecklingsmetoder till konkreta webbsidor och mindre projekt.
- Nivå 1
Förstå → Se exempel → Träna
Förstå
Kärnan
När HTML tolkas skapas en trädliknande modell av dokumentet. JavaScript kan hitta noder, läsa deras egenskaper och ändra innehåll eller attribut.
Så arbetar du
Utgå från HTML-strukturen och identifiera vilket element skriptet behöver läsa eller ändra innan du skriver DOM-kod.
Nyanser och begränsningar
DOM är en modell som skapas av webbläsaren, inte samma sak som den ursprungliga HTML-texten på servern.
I ett webbprojekt
Koppla kunskapen till ett tydligt användarbehov, en definierad struktur och konkreta kvalitetskrav. Bygg i små steg och kontrollera både funktion, standarder, tillgänglighet och dokumentation innan projektet avslutas.
Exempel
Exempel
- JavaScript väljer ett element med ett id och ändrar dess text efter att användaren gjort ett val.
- Förklara därefter vilket webbtekniskt val som är viktigast för att lösningen ska bli robust, begriplig och ändamålsenlig.
Så gör du
- 1Formulera projektets syfte, målgrupp och krav.
- 2Planera struktur och design innan implementation.
- 3Bygg HTML och CSS i små testbara steg.
- 4Lägg till avgränsad JavaScript-logik där den behövs.
- 5Verifiera funktion och dokumentera resultat och beslut.
Vanliga misstag
Vanligt misstag
Att börja bygga innan syfte och krav är tydliga.
Bättre
Formulera målsättning, struktur och testbara krav först.
Det gör verifieringen tydligare senare.
Vanligt misstag
Att använda JavaScript för sådant som HTML eller CSS redan löser bra.
Bättre
Använd varje webbteknik för den roll den är bäst lämpad för.
Mindre onödig kod ger robustare lösningar.
Fundera
Vilket val skulle vara viktigast att kunna motivera när du arbetar med dom – dokumentobjektsmodellen?
Träna
Övning
Beskriv hur du skulle använda kunskapen om dom – dokumentobjektsmodellen i ett mindre webbprojekt.
Sammanfattning
- Förstå DOM som webbläsarens programmerbara representation av HTML-dokumentet.
- Använd webbstandarder och välj teknik efter dess avsedda roll.
- Testa funktion, tillgänglighet och interoperabilitet systematiskt.
- Dokumentera viktiga tekniska, juridiska och etiska val i projektet.
Relaterade genomgångar
Fortsätt med något som hänger ihop med den här genomgången.
JavaScript – orientering
Förstå JavaScripts roll på klientsidan och hur skript kan göra webbsidor mer interaktiva.
Läs genomgångenMålsättning, krav & specifikation
Formulera vad ett mindre webbprojekt ska lösa och vilka krav som behöver uppfyllas.
Läs genomgångenStruktur, design & planering
Planera informationsstruktur och gränssnitt innan hela webbplatsen kodas.
Läs genomgången