其實(shí)canvas本身很簡(jiǎn)單，就是去學(xué)習(xí)它的API，多看實(shí)例，多自己動(dòng)手練習(xí)，多總結(jié)。但是canvas的API實(shí)在是有點(diǎn)多，對(duì)于初學(xué)者來(lái)說(shuō)，可能學(xué)到一半就止步不前了。我也有這種感覺(jué)，在學(xué)習(xí)的過(guò)程中，編寫(xiě)實(shí)例，用到了其中很多的屬性和方法，但是回頭來(lái)看的時(shí)候總覺(jué)得什么也沒(méi)用。所以決定系統(tǒng)性的記錄一下它常用到的API，方便以后查閱，也順便造福一下大家。
另外：附一個(gè)之前學(xué)習(xí)的時(shí)候自己跟著教程寫(xiě)的一個(gè)小游戲：tinyHeart小游戲
開(kāi)始之前
假設(shè)html代碼中有一個(gè)canvas標(biāo)簽：
<canvas id="canvas">你的瀏覽器不支持canvas！</canvas>
如果你的瀏覽器是IE8及以下，那么很遺憾，上面那段文字會(huì)被渲染出來(lái)！而且下面的方法也都不能使用了；所以請(qǐng)使用支持canvas的瀏覽器來(lái)使用后面的方法。
//獲取canvas容器var can = document.getElementById(‘canvas’);//創(chuàng)建一個(gè)畫(huà)布var ctx = can.getContext(‘2d’);
另外我們可以還可以得到容器的寬和高度
var canWid = can.width; //canvas 的寬度var canHei = can.height; //canvas 的高度
