Javascript 清洁矩形

我在脚本中有一个函数，可以在画布上绘制一个矩形。我想清理在“if”条件下绘制的矩形。 我在画布上也有文本（它的坐标是0,80），它不应该被清理。只有矩形部分必须清洁

function red_stroke_2(yy) 
{ 
    //Red color edges
    context.strokeStyle = "#f00";
    context.strokeRect(0,yy,800,40);
}
 if (Option1==answers[qnumber])
{
     red_stroke_2(80);
}

画布是“无状态”的，因为它不知道已绘制的原语或已进行的调用。因此，仅撤消某个图形调用是不可能的。如果需要修改图形，则需要重新绘制所有不希望更改的项目。当然，您可以选择更改单个像素，因此，如果文本为黑色，矩形为红色，则可以替换所有红色像素，但如果启用了抗锯齿功能，并且非常复杂，则效果不会很好

因此，要么重新绘制整个区域（省略矩形图形，但渲染文本）。或者考虑使用2个画布在上面（一个文本，一个背景），那么你当然可以重读背景而不用担心文本。

---

最后但并非最不重要的一点是，使用SVG也可能是一种替代方法，因为它是有状态的，由DOM元素组成，您可以修改/插入/删除这些元素，浏览器将进行合成。在这种情况下，您将有一个

rect

元素和一个

text

元素，您可以简单地删除前者。

这将放置透明像素而不是矩形：

function clean_red_stroke(yy)
{
    context.clearRect(0,yy,800,40);
}
//Call it with the same 'yy' you used in the drawing method
clean_red_stroke(80);

---

然而，我认为您的代码可以通过使用更多的变量（因此是一个最通用的函数）来改进。

context.clearrect？你就是这么想的吗？非常感谢塞巴斯蒂安。这给了我一个新的想法。