Cannot read property "getContext" of null??arc() problem

Question

<canvas id="canvas1" width="578" height="200"></canvas>
function circle()
{
var canvas = document.getElementById("canvas1");
var context = canvas.getContext("2d");
context.beginPath();
context.lineWidth="2";
context.arc(100, 100, 90, 0, 2 * Math.PI);
context.stroke();
}
circle();
I tried to run this programme,but it just keeps showing cannot read property "getContext" of null.Whats's wrong?

Answer 1

Your Javascript needs to be between the <script> element. If it's located in an external file then you need to link it to your HTML. That's not going to work like that, unless you knew this for the purpose of explaining to us.

Within your Javascript add the onload event:

window.onload = function (){

// add all code here so the browser knows what to detect after loading.

}