HTML 参考手册

HTML 标签大全

HTML canvas clearRect() 方法

clearRect() 是 Canvas 2D API 设置指定矩形区域内（以点 (x, y) 为起点，范围是(width, height) ）所有像素变成透明，并擦除之前绘制的所有内容的方法。

在线示例

清除给定矩形内的矩形：

示例

<!DOCTYPE　html>
<html>
<head>
<title>HTML　canvas　clearRect()　方法的使用(基础教程网　oldtoolbag.com)</title>
</head>
<body>
<canvas　id="myCanvas"　width="300"　height="150"　style="border:1px　solid　#d3d3d3>
您的浏览器不支持　HTML5　canvas　标签。
</canvas>
<script>
var　c=document.getElementById("myCanvas");
var　ctx=c.getContext("2d");
ctx.fillStyle="blue";
ctx.fillRect(0,0,300,150);
ctx.clearRect(20,20,100,50);
</script>
</body>
</html>

Teste e veja ‹/›

Compatibilidade do navegador

IEFirefoxOperaChromeSafari

Internet Explorer 9Firefox, Opera, Chrome e Safari suportam clearRect() Método.

Atenção:Internet Explorer 8 Versões anteriores ao <canvas> não suportam o elemento.

Definição e uso

O método clearRect() remove os pixels especificados dentro do retângulo fornecido.

Sintaxe JavaScript:	context.clearRect(x,y,width,height);

Valor do parâmetro

Parâmetro	Descrição
x	Coordenada x do canto superior esquerdo do retângulo a ser limpo.
y	Coordenada y do canto superior esquerdo do retângulo a ser limpo.
width	Largura do retângulo a ser limpo, em pixels.
height	Altura do retângulo a ser limpo, em pixels.

Manual de referência do canvas HTML

HTML: <template> etiqueta