JavaScript inside the head tag

@rootFeb 25.2016 — #Firstly, please remember that the forum has tags to wrap code in, it makes it easier to read.

Secondly, because you are trying to access an element that has not rendered and it will only complete rendering when the whole document has loaded.

You need to delay any script until the document has loaded.

So

[code=html]<!doctype html>
 <html>
 <head>
 <meta charset="utf-8">
 <title>Untitled Document</title>
 
 <script>
 function myFunction (){
 return Math.PI; 
 }
 
 window.onload = function(){
 document.getElementById("demo").innerHTML = myFunction();
 }
 </script>
 
 
 </head>
 
 <body>
 <p>This example calls a function which returns the value of PI:</p>
 
 <p id="demo"></p>
 
 </body>
 </html>[/code]

The proper way (not the sloppy way) to do it is not as others will tell you, place your function in the body or at the end, thats not how you write code, another way and one that I use often is to use the JSON method of creating a function that tests for when the document has become avaiable and thne the script triggers or you can add an event listener to trigger when the document body is available.

JavaScript inside the head tag

2 Comments(s) _↴

Also in #JavaScript _↴

Success!

Social

Version

JavaScript inside the head tag

2 Comments(s) ↴

Also in #JavaScript ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

2 Comments(s) _↴

Also in #JavaScript _↴