第一种，定义一个开关变量，mousedown时在指定区域开关变量为true，画❌，否则不画
第二种，使用clearRect后，重画图片
第三种，如下楼所说，不清除，直接覆盖，

不确定你的最终想要的是块怎么样的功能。是我的话，红点和叉叉都不用canvas直接用img覆盖上去。这是我的一个例子，看起来像是canvas相关很多，但其实都是img做的

另外，你这里要做的话，可以简单的模拟一下像使用createjs之类的库的技巧：你需要一个渲染loop

function renderingLoop() { if(!dirty) return; // do your clearRect context.clearRect(); // for-each every targets you want to render into the canvas displayObjects.forEach(function(object) { if(!object.hidden) { // draw this object into canvas } }); requestAnimationFrame(renderingLoop); }

上面是一个思路

1. 把要绘制在canvas上的目标对象放在一个loop里面循环渲染

2. 发生交互时，去更改对应对象的hidden属性，同时更新dirty标识变量，告诉loop需要重新绘制

3. 下一次loop发生时，所有新标志为hidden的对象就没有了，其他对象依旧绘制在了canvas上

叉是常量，画图是变量，两个不应该在同一个canvas里面，可以把叉用html或另一个canvas里面，或者用其他的canvas库，类似createjs

不知道机工社的这本html和canvas核心技术的书是否能帮到你