如何在Javascript中强制画布刷新

function draw() {
    var canvas = document.getElementById('myCanvas');
    var ctx = canvas.getContext('2d');
    
    // 清空画布
    ctx.clearRect(0, 0, canvas.width, canvas.height);
    
    // 绘制新内容
    ctx.fillStyle = 'blue';
    ctx.fillRect(10, 10, 50, 50);
}

// 调用draw函数来刷新画布
draw();

function animate() {
    var canvas = document.getElementById('myCanvas');
    var ctx = canvas.getContext('2d');
    
    // 清空画布
    ctx.clearRect(0, 0, canvas.width, canvas.height);
    
    // 绘制新内容
    ctx.fillStyle = 'blue';
    ctx.fillRect(10, 10, 50, 50);
    
    // 请求下一帧动画
    requestAnimationFrame(animate);
}

// 开始动画
animate();

function refreshCanvas() {
    var canvas = document.getElementById('myCanvas');
    canvas.width = canvas.width; // 或者 canvas.height = canvas.height;
}

// 调用refreshCanvas函数来刷新画布
refreshCanvas();

var canvas = document.getElementById('myCanvas');
var ctx = canvas.getContext('2d');
var bufferCanvas = document.createElement('canvas');
bufferCanvas.width = canvas.width;
bufferCanvas.height = canvas.height;
var bufferCtx = bufferCanvas.getContext('2d');

function draw() {
    // 在缓冲画布上绘制
    bufferCtx.clearRect(0, 0, bufferCanvas.width, bufferCanvas.height);
    bufferCtx.fillStyle = 'blue';
    bufferCtx.fillRect(10, 10, 50, 50);
    
    // 将缓冲画布的内容复制到主画布
    ctx.clearRect(0, 0, canvas.width, canvas.height);
    ctx.drawImage(bufferCanvas, 0, 0);
}

// 调用draw函数来刷新画布
draw();