canvas画一个简单的红色矩形

function draw(id) {  
    var canvas = document.getElementById(id); //取得canvas的对象
    if (canvas == null)  
        return false;  
    var context = canvas.getContext('2d');  //获取画布对象
    context.fillStyle = "#EEEEFF";  //对画布填充颜色
    //参数===>x: 矩形左上角的 x 坐标  y:    矩形左上角的 y 坐标，width：  矩形的宽度，以像素计 ,height： 矩形的高度，以像素计
    context.fillRect(0, 0, 400, 300); //fillRect() 方法绘制“已填色”的矩形。默认的填充颜色是黑色。
    context.fillStyle = "red";  //为将要画的图像设置颜色
    context.strokeStyle = "blue";  //图像的边框线颜色  ->strokeStyle 属性设置或返回用于笔触的颜色、渐变或模式。
    context.lineWidth=1;//线的大小->lineWidth 属性设置或返回当前线条的宽度，以像素计。
    context.fillRect(50,50,100,100);  //图像的坐标以及宽高
    context.strokeRect(50,50,100,100);  //strokeRect() 方法绘制矩形（不填色）。笔触的默认颜色是黑色。
}

来自我的网站：canvas画一个简单的红色矩形