html5 canvas使用--绘制一条直线
?
<!DOCTYPE html><Html><head><meta charset="UTF-8"/><script>function drawLine(){ // 取得canvas对象及其上下文对象 var canvas=document.getElementById("drawLine"); var context=canvas.getContext('2d'); //开始启动画笔 context.beginPath(); //开始点 context.moveTo(70,140); //结束点 context.lineTo(140,70); //绘制 context.stroke();}window.addEventListener("load",drawLine,true);</script></head><title>html5绘制一条直线</title><body> <div id="info"></div> <canvas id="drawLine" style="border:1px solid;width:200px;height:200px;"></canvas> <script> //检测浏览器是否支持HTML5try{document.createElement("canvas").getContext("2d");document.getElementById("info").innerHTML="该浏览器支持HTML5";}catch(e){document.getElementById("info").innerHTML="该浏览器不支持HTML5"} </script></body></Html>