Les 2
Waar je JavaScript kunt plaatsen
Het voorbeeldscript in de vorige les werd tussen de <body> en
</body> tags geplaatst.
Je kunt je script in totaal op vier manieren plaatsen:
- in het head gedeelte van de pagina
- zoals gezegd, in het body gedeelte
- in het head én het body gedeelte
- en in een extern bestand
Scripts in het head gedeelte
Het head gedeelte van een pagina wordt het eerst geladen.
Dus: een script dat je in het head
gedeelte zet, is al geladen voordat er code uit het body gedeelte wordt uitgevoerd.
Soms
is het vereist om bepaalde JavaScript code in het head gedeelte te zetten, bijvoorbeeld bij het
gebruik van functies in JavaScript (dit onderwerp wordt later nog behandeld).
De structuur van een script in het head gedeelte:
<html>
<head>
<script language="JavaScript">
hier komt de JavaScript code
</script>
</head>
Scripts in het body gedeelte
Een voorbeeld hiervan hebben we in de vorige les gezien.
In het body gedeelte plaats je
scripts die uitgevoerd moeten worden als de inhoud van de pagina geladen wordt.
De structuur van een script in het body gedeelte:
<html>
<head>
</head>
<body>
<script language="JavaScript">
hier komt de JavaScript code
</script>
</body>
</html>
Scripts in het head én het body gedeelte
Er is geen limiet aan het aantal scripts dat je in een pagine mag gebruiken.
Je kunt dus
zowel JavaScript in het head gedeelte en in het body gedeelte van je pagina zetten.
Het komt vaak voor dat er eerst een aantal functies of variabelen in het head gedeelte worden
benoemd met een JavaScript-code, waarna ze door een script in het body gedeelte worden opgeroepen
en uitgevoerd.
De structuur van scripts in het head en body gedeelte:
<html>
<head>
<script language="JavaScript">
hier komt de JavaScript code, bijv. functies en variabelen
</script>
</head>
<body>
<script language="JavaScript">
hier komt weer JavaScript code
</script>
</body>
</html>
Een extern script maken
Een extern script is een JavaScript code die in een apart bestand staat.
Dit is een JavaScript bestand met de extensie .js.
Zo'n extern script is vooral
handig als je een bepaald script op meerdere pagina's wilt uitvoeren.
Nu kun je gewoon
naar het externe bestand verwijzen, zonder dat je de JavaScript code op iedere pagina hoeft
in te voeren.
In het externe script staat alleen JavaScript code!
Je moet er dus geen HTML tags in
zetten.
Dit is een voorbeeld van de inhoud van een .js bestand:
document.write("Dit is een extern script!");
Je ziet: het script bevat alleen JavaScript code en geen HTML tags.
Om er
een JavaScript bestand van te maken, is het nu alleen nog nodig om dit bestand op te slaan als
.js bestand, bijv. script.js.
Het externe script is nu gemaakt. Nu kunnen we in de HTML pagina naar het externe script verwijzen door middel van de volgende code:
<script language="JavaScript" src="script.js">
</script>
Laten we alles nog eens op een rij zetten in het volgende voorbeeld:
<html>
<head>
</head>
<body>
<script language="JavaScript" src="script.js">
</script>
</body>
</html>
In dit HTML bestand wordt verwezen naar het bestand "script.js".
De inhoud van het bestand script.js is:
<!-- Het script verbergen voor oude browsers
document.write("Dit is een extern script!");
// Einde verbergen -->
Klik hier om dit voorbeeld uit te voeren.
Einde les 2
In deze les heb je gezien waar je JavaScript kunt gebruiken.
Je weet nu onder andere hoe je
naar een extern script moet verwijzen.
De volgende les gaat over variabelen.
Homepage-Maken Tip
De makkelijkste manier om je eigen website te maken?
Dat is via een website bouwer als Weebly. Hiermee kun je eenvoudig via je browser door middel van drag-en-drop een website bouwen. Je kunt volledig gratis beginnen met 500MB webruimte voor je site. Zo nodig kun je een betaald pakket nemen met eigen domeinnaam, "onbeperkte" opslag (fair use policy) en e-commerce mogelijkheden.
Weebly is daarom een prima optie als je snel een website in elkaar wilt zetten. Kennis van HTML of het installeren van een eigen content management systeem is niet nodig bij Weebly.
