HTML |画布 clearRect() 方法

clearRect() 方法用于清除给定矩形内的指定像素。

句法：

context.clearRect( x, y, width, height )

参数：

• x：它存储矩形左上角的 x 坐标。
• y：它存储矩形左上角的 y 坐标。
• 宽度：它以像素为单位存储宽度。
• 高度：它以像素为单位存储高度。

示例 1：

  

    
        HTML canvas clearRect() Method
    

  

    
  
  
    
        var x = document.getElementById("GFG");
        var contex = x.getContext("2d");
        contex.fillRect(50, 50, 350, 200);
        contex.clearRect(100, 100, 250, 100);
        contex.stroke();
    

  

输出：

示例 2：

  

    
        HTML canvas clearRect() Method
    

  

    
  
  
    
        var x = document.getElementById("GFG");
        var contex = x.getContext("2d");
        contex.fillStyle = "green";
        contex.fillRect(50, 50, 350, 200);
        contex.clearRect(130, 60, 250, 100);
        contex.stroke();
    
  

  

输出：

支持的浏览器：

• 谷歌浏览器
• 浏览器 9.0
• 火狐
• 苹果浏览器
• 歌剧