мой холст не отображается в браузере

#javascript #canvas #html5-canvas

#javascript #холст #html5-холст

Вопрос:

по какой-то причине мой холст html5 не отображается в браузере. Я пытаюсь нарисовать черный квадрат, он просто не загружается в браузер, это просто пустая страница… Пожалуйста, помогите мне, я не знаю, что не так..

 <html&&t;
<head&&t;
<title&&t;setup</title&&t;
</head&&t;
<body&&t;
<canvas id="canvas" width="800" hei&ht="800"&&t;</canvas&&t;
<script&&t;
var canvas
var canvasContext
window.onload = function() {
canvas = document.&etElementById("myCanvas")
canvasContext = canvas.&etContext("2d")
canvasContext.fillStyle = "black";
canvasContext.fillRect(0,0,canvas.width,canvas.hei&ht)
canvasContext.fillStyle = "red";
canvasContext.fillRect(125, 250, 75, 75)
}
</script&&t;
</body&&t;
</html&&t;

1. Добро пожаловать в SO! Ваш холст отображается, id="canvas" но ваш селектор ищет myCanvas . Кроме того, если вы запускаете скрипт, и он не выполняет то, что вы ожидаете, пожалуйста, откройте консоль разработчика и посмотрите на ошибку. Он в значительной степени точно сообщает вам, в чем проблема, и позволяет решить проблему намного быстрее, чем публикация здесь.

Ответ №1:

Ваш холст «есть» там — однако это просто белый (пустой) двоичный объект.

Ни одно из ваших взаимодействий с ним не работает, поскольку вы пытались найти его, используя идентификатор «MyCanvas», а не просто «canvas», который вы использовали в своем HTML.

Если вы измените эту строку:

 canvas = document.&etElementById("myCanvas")

Для

 canvas = document.&etElementById("canvas")

Это должно сработать у вас

Ответ №2:

Это ответ на вопрос:

 canvas = document.&etElementById("canvas");