Kaikissa oppaissa mitä olen lukenut on sanottu, että javascript-koodi tulisi laittaa sivujen head-tagien väliin. Ongelma on kuitenkin se, että jos laitan koodin head-tagien väliin, niin ohjelma ei toimi. Jos taas laitan jscript-koodin html-rakenteiden jälkeen, niin koodi toimii. Mistäköhän tämä johtuu?
Jos koodi on head-lohkossa ja viitataan esim. johonkin elementtiin body-lohkossa, ei koodin suorituksen aikana elementtiä vielä ole.
Seuraava ei siis toimi:
<html>
<head>
<script type="text/javascript">
alert(document.getElementById("foo").innerHTML);
</script>
</head>
<body>
<div id="foo">Minua ei ole vielä! =(</div>
</body>
</html>Tämän pystyy kiertämään window.onload-eventillä, joka suoritetaan vasta kun DOMit summuut on ladattu.
<html>
<head>
<script type="text/javascript">
window.onload = function() { alert(document.getElementById("foo").innerHTML); }
</script>
</head>
<body>
<div id="foo">Minua ei ole vielä! =(</div>
</body>
</html>Toimii.
Ja ei kai tuosta javascriptin upottamisesta muualle kuin headiin ole mitään haittaa enää nykyään, mutta jos haluaa esim. sivun validaattorista läpi, täytyy muistaa laittaa monimutkaisempi js-pätkä kommentteihin:
<script type="text/javascript">
<!--
if (foo = bar) {
...
}
//-->
</script>Jos käytetään XHTML:ää, oikeaoppinen tapa olisi käyttää CDATA-lohkoa, mutta XML:ää tukemattomat selaimet eivät sitä tue. Osoitteessa http://developer.mozilla.org/en/docs/
Aihe on jo aika vanha, joten et voi enää vastata siihen.