我们用的最基本的绘图环境在canvas中绘图，通过调用canvas对象的getContext()方法来获取绘图环境。getContext()方法只需要一个参数：绘图环境的类型。在游戏中，我们使用2D类型的绘图环境。
获取canvas绘图环境
<>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset = utf-8">
<title>HTML5</title>
<script type="text/javascript" charset = "utf-8">
//这个函数将在页面完全加载后调用
function pageLoaded()
{
//获取canvas对象的引用,注意tCanvas名字必须和下面body里面的id相同
var canvas = document.getElementById('tCanvas');
//获取该canvas的2D绘图环境
var context = canvas.getContext('2d');
//绘制代码将出现在这里
}
</script>
</head>
<body onload="pageLoaded();">
<canvas width = "400" height = "200" id = "tCanvas" style = "border:black 1px solid;">
<>
提示：你的浏览器不支持<canvas>标签
</canvas>
</body>
</html>
【HTML5通过调用canvas对象的getContext()方法来获取绘图环境】相关文章：
★ 使用HTML5 Canvas API中的clip()方法裁剪区域图像
★ HTML5自定义data-* data(obj)属性和jquery的data()方法的使用
★ HTML5 canvas画矩形时出现边框样式不一致的解决方法
★ 使用HTML5中的contentEditable来将多行文本自动增高
★ HTML5 Canvas之测试浏览器是否支持Canvas的方法