canvas 无法清空画布问题

      <canvas id="canvas"></canvas>
              <script type="text/javascript">
                var canvas=document.getElementById("canvas");
                var ctx=canvas.getContext("2d");

                var img=new Image();
                    img.src="img/zzx.jpg"
                    function drawImg(){
                             img.οnlοad=function(){
                             ctx.drawImage(img,0,0); 
                             }                                                   
                    }
                    function drawRect(){
                             ctx.clearRect(0,0,400,300);
                             ctx.fillStyle="#083b81";
                             ctx.rect(0,0,400,300);
                             ctx.fill();
                    }
                    drawRect();
                    drawImg();
                    drawRect();
                    ctx.clearRect(0,0,400,300);        
               </script>

       当我用这样的方式我没有办法清空我加载绘制在canvas中的图片

当我把ctx.clearRect(0,0,400,300);这个方法添加在img.onload中，画布顺利清空！

我想问下怎样在外部清空画布；或者怎样把这个加载的图片从网页缓存中删除！

如果没有理解我的意思，可以按照代码试下！你就会理解了