html5有一个新的标签"canvas",顾名思义就是画布，做来作图，其中要在canvas上画图，都要经过JavaScript来完成。
下图是浏览器支持canvas情况
很明显的现代浏览器都支持canvas，只有万恶的IE6还是无法使用，同时IE7以上需要特殊的js库支持。
要IE6支持canvas，首先要浏览器知道有这个标签。
也就是document.createElement('canvas');
然后写css，让这个新建的标签有基本的样式
canvas{ display:block;}
到这一步，canvas就能在IE6下作为一个合法的标签使用了。
然后就是要在canvas上绘画，
在IE中，这里指是IE678，不止是IE6，要想现代浏览器那样绘画，必须先引入一个js库
文件如下，
excanvas.js
这是google上面的excanvas.js，你也可以百度一下，也能找到。
下载完文件，在页面引入文件的时候，必须要放在头部。也就是<head></head>中
如
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Dive Into HTML 5</title>
<!--[if IE]>
<script src="http://blog.163.com/yhwwen@126/blog/excanvas.js"></script>
<![endif]-->
</head>
<body>
...
</body>
</html>
有一点需要注意的是，即使你已经引入了这个库，并不代表你就可以立即使用，如现代浏览器那样，在IE中必须要等到页面全部渲染完这个库才能生效。也就是，如:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Dive Into HTML 5</title>
<!--[if IE]>
<script src="http://blog.163.com/yhwwen@126/blog/excanvas.js"></script>
<![endif]-->
</head>
<body>
<canvas id="canvas_box" width="300" height="300"></canvas>
</body>
<script type="text/javascript">
var canvas = document.getElementById('canvas_box');
var context = canvas.getContext('2d');
context.fillStyle="#000";
context.fillRect(0, 0, 100, 100);
</script>
</html>
在IE中会报错，错误是是getContext()未定义。
正如我所说的，excanvas.js要整个页面渲染完了才会生效的。所以我们可以这样写
window.onload = function(){
...//把上面canvas放进来，就可以。
}
更新时间：2016-02-17
