我们用的最基本的绘图环境在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控制字体的显示与渲染的方法
★ html5的canvas元素使用方法介绍(画矩形、画折线、圆形)
★ HTML5使用ApplicationCache接口实现离线缓存技术解决离线难题
★ 使用HTML5 Canvas API中的clip()方法裁剪区域图像
★ 有关HTML5 Video对象的ontimeupdate事件(Chrome上无效)的问题
★ 使用HTML5中的contentEditable来将多行文本自动增高