Chrome响应良好:上下文。clearRect (x, y, w, h);正如@Pentium10所建议的，但IE9似乎完全忽略了这条指令。 IE9似乎对:canvas做出了响应。宽度= canvas.width;但它不清除线条，只是形状，图片和其他物体，除非你也使用@John Allsopp的解决方案，首先改变宽度。

如果你有一个canvas和context是这样创建的:

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

你可以使用这样的方法:

function clearCanvas(context, canvas) {
  context.clearRect(0, 0, canvas.width, canvas.height);
  var w = canvas.width;
  canvas.width = 1;
  canvas.width = w;
}

用途:上下文。clearRect(0,0, canvas.)宽度,canvas.height);

这是清除整个画布的最快和最直观的方法。

不要使用:canvas。宽度= canvas.width;

重置画布。width重置所有的画布状态(例如，转换，lineWidth, strokeStyle等)，它非常慢(与clearRect相比)，它不能在所有浏览器中工作，并且它不能描述你实际上试图做什么。

处理变换后的坐标

如果你已经修改了转换矩阵(例如使用缩放，旋转或翻译)，那么context.clearRect(0,0,canvas.width,canvas.height)可能不会清除画布的整个可见部分。

解决方案?在清除画布之前重置转换矩阵:

// Store the current transformation matrix
context.save();

// Use the identity matrix while clearing the canvas
context.setTransform(1, 0, 0, 1, 0, 0);
context.clearRect(0, 0, canvas.width, canvas.height);

// Restore the transform
context.restore();

编辑: 我刚刚做了一些分析(在Chrome中)，它是大约10%的速度，以清除一个300x150(默认大小)的画布，而不重置转换。随着画布尺寸的增加，这种差异就会减小。

这已经是相对微不足道的了，但在大多数情况下，您提取的金额将远远超过您出清的金额，我相信这种性能差异是无关紧要的。

100000 iterations averaged 10 times:
1885ms to clear
2112ms to reset and clear

如果你在画线条，请确保不要忘记:

context.beginPath();

否则这些行就不会被清除。

Chrome响应良好:上下文。clearRect (x, y, w, h);正如@Pentium10所建议的，但IE9似乎完全忽略了这条指令。 IE9似乎对:canvas做出了响应。宽度= canvas.width;但它不清除线条，只是形状，图片和其他物体，除非你也使用@John Allsopp的解决方案，首先改变宽度。

如果你有一个canvas和context是这样创建的:

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

你可以使用这样的方法:

function clearCanvas(context, canvas) {
  context.clearRect(0, 0, canvas.width, canvas.height);
  var w = canvas.width;
  canvas.width = 1;
  canvas.width = w;
}

最快的方式:

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

//... some drawing here

i = c.createImageData(canvas.width, canvas.height);
c.putImageData(i, 0, 0); // clear context by putting empty image data

Context.clearRect(starting width, starting height, ending width, ending height);

例如:上下文。clearRect(0,0, canvas.)宽度,canvas.height);