十、canvas元素
一、canvas元素的基础知识 canvas元素是html5中新增的一个重要的元素，专门用来绘制图形。在页面上放置了一个canvas元素，就相当于在页面上放置了一块“画布”，可以在其中绘画图形。但是在canvas中绘图，并不是用鼠标画图。事实上，canvas元素只是一块无色透明的区域。需要使用javascript编写在其中进行绘画的脚本。从这个角度来说，可以把他理解为类似其他开发语言中的canvas画布。 1、在页面中放置canvas元素，首先要指定的是id、width、height三个属性。 事例代码如下： <body onload="draw('canvas')"> <canvas id="canvas" width="200" height="200"></canvas> </body> </html> <script type="text/javascript"> function draw(id){ var canvas=document.getElementById(id); //获取canvas元素 var context=canvas.getContext("2d"); //获得图形上下文 context.fillStyle="#ddd"; //设定绘图样式 context.fillRect(10,10,100,100); //绘制矩形 context