Kode i eksterne filer
Da vi kiggede på vores bestanddele kunne vi se at HTML, CSS og Javascript koden var blandet sammen i én stor pærevælling.
Det bliver hurtigt meget uoverskueligt og af samme grund vil vi derfor placere vores CSS og Javascript kode i eksterne filer så vi kan behandle dem separat.
Efterhånden som din Rige Internet Applikation vokser i størrelse og omfang kan det endda være en fordel at opdele din kode i flere selvstændige eksterne filer.
Indtil videre vil vi benytte os af en enkelt CSS og JS fil, kaldet mitlayout.css og minkode.js.
Som vi kan se i eksemplet herunder er vores Rige Internet Applikation nu blevet mere overskuelig.
Vores HTML kode
Vi placerer vores CSS kode i en ekstern fil, mitlayout.css, og inkluderer den i linje 5 ved at bruge link elementet.
På samme måde placerer vi vores Javascript kode i en ekstern fil, minkode.js, og inkluderer den i linje 6 ved at bruge script elementet.
Vores CSS fil, mitlayout.css
Vores CSS kode har ikke ændret sig selvom den nu er placeret i en ekstern fil. I den første linje giver vi dokumentet en bredde og centrerer det, hvorefter vi i linje 2 og 3 angiver hvilken farve vores links skal have, hvad enten vi har musen over dem eller ej.
Vores script fil, minkode.js
Det er generelt en god idé at adskille sin struktur, layout og kode fra hinanden hvor det end er muligt, så samtidig med at vi har lagt vores Javascript kode ud i en ekstern fil har vi også flyttet vores onload funktion fra HTML koden ind i en deklaration i vores Javascript kode i linje 5.
Du kan se hvordan det komplette eksempel til dette kapitel fungerer i koden.