当我清除画布时，“ canvas.clearRect不是函数”

Question

我正在尝试在HTML5画布上绘制一个圆并四处移动。

我写了这个Javascript代码：

 var a = 0; function draw() { var c = document.getElementById("game"); var ctx = c.getContext("2d"); ctx.clearRect(0, 0, canvas.width, canvas.height); ctx.beginPath(); ctx.arc(45+a, 45, 40, 0, 2 * Math.PI); ctx.stroke(); a++; } var t=setInterval(draw,1000); 

 <canvas id="game" width="640" height="480"></canvas> 

当我尝试执行它时，在控制台中出现此错误：

TypeError：canvas.clearRect不是函数

我该如何解决？

谢谢。

Answer 1

在clearRect方法中，因为canvas是undefined ， canvas.width和canvas.height将引发错误。 您应该传递有效的对象。

 var a = 0; function draw() { var canvas = document.getElementById("game"); var ctx = canvas.getContext("2d"); ctx.clearRect(0, 0, canvas.width, canvas.height); ctx.beginPath(); ctx.arc(45 + a, 45, 40, 0, 2 * Math.PI); ctx.stroke(); a++; } var t = setInterval(draw, 1000); 

 <canvas id="game" width="640" height="480"></canvas>