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>

Vérifiez avec ce test ‹/›

Compatibilité des navigateurs

IEFirefoxOperaChromeSafari

Internet Explorer 9et les navigateurs Firefox, Opera, Chrome et Safari prennent en charge clearRect() Méthode.

Attention :Internet Explorer 8 Les versions précédentes de HTML ne prennent pas en charge l'élément <canvas>.

Définition et utilisation

La méthode clearRect() efface les pixels spécifiés à l'intérieur du rectangle donné.

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

Valeur du paramètre

Paramètres	Description
x	Coordonnée x du coin supérieur gauche du rectangle à effacer.
y	Coordonnée y du coin supérieur gauche du rectangle à effacer.
width	Largeur du rectangle à effacer, en pixels.
height	Hauteur du rectangle à effacer, en pixels.

Manuel de référence HTML canvas

HTML: <template> balise