Om detta exempel: JavaScript
Denna beskrivning av tre kolumn-design gjordes för att uppfylla, eller försöka uppfylla, kraven för betyget väl godkänd (VG) på kursen Webbdesign med JavaScript och Document Object Model vid Umeå universitet sommaren 2008. Nedan listas några av kraven samt om, och eventuellt var, jag uppfyllt respektive krav ([visas så här] efter krav).
Några krav för godkänt (G) och/eller väl godkänt (VG)
- Du får men behöver inte använda dig av Prototype.
Jag har valt att lära mig JavaScript och DOM bättre innan jag börjar titta på ramverk, m.m.. - Inga andra ramverk eller funktionsbibliotek är tillåtna.
Se föregående punkt. :-) (OK, så jag har använt addLoadEvent från boken, men jag anser det inte vara ett funktionsbiliotek. :-) - All din kod ska skrivas i karlfeldt.js. Det är denna fil du ska lämna
in, ingen annan.
Eftersom jag gjort ett eget projekt så har jag lagt min kod i filen index_html.js då den endast gäller för filen index.html. - Användning av innerHTML är inte tillåten och kommer att leda till uppgiften
bedöms som underkänd.
[Vet inte hur man använder denna egenskap. :-)] - Uppgiften är individuell och ska genomföras självständigt.
[Uppgiften är, vad jag vet, unik och har lösts av enbart mig. :-)]
- Är min sida eller sajt funktionsduglig utan Javascript?
[Ja! CSS och JavaScript lades till sist.] - Är sidan eller sajten exempel på något som potentiellt eller faktiskt
kan vara av intresse och fylla en funktion för någon?
[Det hoppas jag. Jag har fått positiv respons på min tidigare webbplats, Björns studiewebb, med liknande innehåll. :-)] - Innebär projektet att sidan/sajten substantiellt förändras genom användningen
av Javascript och manipulering av DOM-trädet?
[Ja!] - Innehåller projektet dynamisk förändring av DOM-trädet i form av tillägg,
borttagning och uppdatering av element i en omfattning som motsvarar
Karlfeldt-uppgiften?
[Ja och nej... Många saker läggs till och ändras, men ren borttagning förekommer inte.] - Innehåller projektet element vars synlighet förändras baserat på hur
användaren agerar?
[Ja! När besökare klickar på "Visa/Dölj"-länkar visas respektive döljs delar av webbsida.]
Jämförelse med Karlfeldt-uppgift
- Alla dikter ska vara dolda då sida laddas.
Jag har valt att visa första avsnittet när sida laddas, men övriga delar är dolda. - Endast en dikt visas åt gången.
När besökare klickar på länk till nytt avsnitt så döljs "aktuell" avsnitt innan nytt avsnitt visas. - Ta bort stycken av klassen "aterga".
Jag hittade inte motsvarande tillämpning för detta...
- Räkna antal stycken och rader.
Jag skapar en innehållsförteckning innehållande länkar till alla H3-element vilket jag anser motsvarar funktion med diktinformation - hitta alla element samt skapa nya noder för att presentera ny information m.h.a. hittad information. Vad jag inte gör är att söka fram en delmängd av noder för att sen söka i delmängden. - Länktext "Visa/Dölj info"
Jag har "Visa XHTML-/CSS-kod"-länkar som visar kod för respektive avsnitt och ändrar texten till "Dölj XHMTL-/CSS-kod" samt omvänt (döljer kod och ändrar tillbaka text).
Lärdommar om JavaScript från designande av exempel
Nedan finns en del lärdommar jag fått från att designa detta exempel samt eventuella förslag på lösningar (om det finns någon/några). De visas numrerade men de visas i ingen speciell ordning i övrigt.
- Startsidan, den med beskrivning av design för exempel, har en massa JavaScript-kod associerad med den för att visa och dölja delar av dokumentet. Jag inser nu att jag har suttit och skrivit en massa kod som endast fungerar med detta dokument...:-( (Samtidigt så skulle jag kunna bryta ut en del funktioner och återanvända dem... men det är ändå en massa kod för ett dokument.) Lösning: Gör fler sidor om jag vill bryta upp något. (?)
- Jag är osäker på om detta sätt att bryta upp ett dokument är vidare praktiskt... Som det fungerar nu så går det inte att skriva ut hela dokumentet på en gång, och alla utskrifter kommer innehålla samma sak om och om igen (bl.a. meny och länkar som det inte är någon nytta med i utskrift). Frågan är om det ger besökare något att dela upp det? Lösning 1: Det går givetvis att göra en stilmall för utskrift, vilket jag vill lära mig. :-) Lösning 2: Gör det möjligt att visa hela dokumentet på en gång, ev. med eller utan kod.
- Struktur av dokument, främst namngivning av saker, är lite ad hoc. Lösning:Namnge ("idge") element bättre samt använd eventuellt klasser. Detta skulle även kunna vara en lösning till punkt 1 ovan.
Till början på sida