document.getElementById на холсте return null

Question

Я новичок в javascript, и я об этом узнал. При этом я столкнулся с этой проблемой, которую я не могу понять, и я здесь для вашей помощи.

Это страница, что я был, http://www.w3schools.com/html/tryit.asp?filename=tryhtml5_canvas_empty

Теперь, когда я бегу следующий на консоли (поджигатель) он возвращается нуль.

Почему я не получаю ожидаемый результат здесь?

Answer 1

DOM уже загружен, когда вызывается функция draw-function.

Но var canvas = document.getElementById ('control'); - строка оценивается до этого, потому что она не находится в функции draw. Он выполняется немедленно в документе перед тем, как элементы были визуализированы.

Я хотел бы предложить вам изменить функцию инициализации что-то вроде этого

var canvas = document.getElementById('myCanvas'); 
var context = canvas.getContext('2d');