Lesweek 9: JavaScript: tot slot

Leerdoelen

Voor achtergrond bij de inhoud van deze lesbrief kun je hoofdstuk 9 lezen van het boek.

Presentatie van pagina aanpassen

We hebben de vorige lesbrief het belang van de scheiding tussen structuur, presentatie en gedrag van een website behandeld. De presentatie van een website wordt gedaan met CSS. Deze presentatie kan worden aangepast door twee style sheets te maken en met JavaScript te switchen van de ene naar de andere style sheet. Het nadeel hiervan is dat een hele nieuwe style sheet gemaakt dient te worden, ook als het minieme veranderingen betreft. Een oplossing hiervoor is het gebruik van CSS-DOM. Hierbij pas je style in de CSS dynamisch aan met behulp van JavaScript. In hoofdstuk 9 van het boek zijn hier enkele voorbeelden van te vinden. De style van een website kun je dus altijd het beste maken met CSS, maar in gevallen waarin je gedrag wilt dat niet mogelijk is met CSS kun je deze aanpassen met JavaScript.

Browser compatibility

Er zijn verschillende versie van JavaScript en deze zijn ook nog eens verschillend geimplementeerd in de diverse browsers. Dit zal de komende jaren zeker zo blijven. Het is mogelijk om in je code met JavaScript te testen welke browser en welke versie gebruikt wordt. Dit is echter niet verstandig omdat dit om constant onderhoud vraagt bij iedere upgrade van browsers. Beter is het om gebruik te maken van object detection waarbij je vooraf controleert of een object of methode binnen de browser bestaat voordat je het script uitvoert. Voorbeelden staan op pagina 89 van het boek. Dit wordt aangegeven met backwards compatibility van je JavaScript: je pagina ook toegankelijk maken voor oudere versies van je browser.

Enige jaren geleden werden in de diverse browsers verschillende varianten van het DOM geimplementeerd. De standaard die wij gebruiken is van W3C en wordt meestal DOM Core genoemd. De meeste browsers ondersteunen nog methoden uit de "oudere HTML-DOM" die niet gedefinieerd zijn in de W3C DOM Core. Voorbeelden hiervan zijn document.write en innerHTML. In hoofdstuk 7 van het boek is uitgelegd hoe je deze methoden kunt vervangen met DOM Core methoden.

Een terugblik

Vanwege de verschillende browsers is het belangrijk je websites zo universeel mogelijk te maken. Bovendien wil je dat je website ook toegankelijk is voor andere toepassingen zoals zoekmachines. Daarom is in deze cursus de nadruk gelegd op het gebruik van de DOM Core en speciale aandacht gegeven aan:

We hebben in deze cursus leren werken met JavaScript en gezien dat JavaScript een programmeertaal is met de meeste eigenschappen van een programmertaal: statements, variabelen, operatoren, conditional statements (if), looping statements (while, for) en functions. De kracht van JavaScript in deze cursus lag in het kunnen gebruiken van DOM Core methoden met JavaScript. De belangrijkste DOM Core methoden zijn:

voor het opvragen van informatie uit een website:

voor het veranderen/toevoegen van informatie aan een website:

In de reference van het boek (pagina 312) is een overzicht te vinden van de belangrijkste methoden uit DOM Core.

Tot slot geeft de auteur van het boek in hoofdstuk 12 zijn kijk op de toekomst. Zeker is dat we in de toekomst nieuwe browsers krijgen, een nieuwere DOM Core, CSS 3, meer gebruik van AJAX, enz.