HTML5 Canvas rect()和strokeRect() 的区别

看到 Canvas rect()和strokeRect()时，发现这俩效果一样。仔细区分后发现：

他们都接受相同的参数，但rect() 只是创建一个矩形，并不绘制，如图：

                    

要看到实际效果需要使用 stroke() 或 fill() 方法在画布上实际地绘制矩形。

例如：

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.rect(20,20,150,100);
ctx.stroke();

而 strokeRect()

方法绘制矩形（不填色）。笔触的默认颜色是黑色。

可以使用 strokeStyle 属性来设置笔触的颜色、渐变或模式。