Question

我用了一个udemy课程来制作一个简单的乒乓球比赛。我现在再次重新创建它作为练习，我不断得到错误画布为空。任何帮助？

<html>
 <canvas id="gamecanvas" width="600" height="800"></canvas>
<script>
var canvas = null;
var Context = null;

window.onload = function(){

canvas.document.getElementById("gamecanvas");
Context.canvas.getContext("2d");
 drawEverything();
 }

function drawEverything() {
Context.fillStyle = "black";
Context.fillRect(0,0,canvas.width,canvas.height);

Context.fillStyle  = "white";
Context.fillRect(0,360,20,80);


Context.fillStyle  = "white";
Context.fillRect(580,360,20,80);


Context.fillStyle = "green";
context.beginpath();
context.arc(0,0,10,10,Math.PI*2,true);
context.fill();


}

Answer 1

那是因为你把它设置为null！改变

canvas.document.getElementById("gamecanvas");

要

canvas = document.getElementById("gamecanvas");

否则，你永远不会设置画布。

Answer 2

你应该这样做。

canvas = document.getElementById("gamecanvas");
Context = canvas.getContext("2d");

Answer 3

您将canvas设置为null，因此它当然为null。这应该有所帮助。

canvas = document.getElementById("gamecanvas")
context = canvas.getContext("2d");

我的Html画布为空。真烦人

3 个答案: