html5-canvas矩形

<canvas width="500" height="800"    id="canvas">
</canvas>
<script>
//获取画布DOM  还不可以操作
var canvas=document.getElementById('canvas');

//alert(canvas);
//设置绘图环境
var cxt=canvas.getContext('2d');
//alert(cxt);


//画一个矩形
cxt.beginPath();
cxt.rect(300,20,100,100);
cxt.stroke();
cxt.closePath();

//实心矩形
cxt.beginPath();
cxt.rect(300,270,100,100);
cxt.fill();
cxt.closePath();