HTML 5 基础教程

HTML是超文本标记语言，是一种专门用来制作网页的语言，而HTML5就是它的第五个版本，2014年10月29日，万维网联盟宣布，经过接近8年的艰苦努力，该标准规范终于制定完成，该标准针对当前互联网的飞速发展制定了更加标准的网页语言规范及适用功能，同时也给我们开发者带来了更多的开发选择，学习它是每个前端开发者必修的课程。

W3CAPI

2020-06-15 06:59:35

文档目录

我的书签

请登录

HTML5 SVG 和 Canvas 的区别

通过学习我们知道在HTML5 中 Canvas 和 SVG 都允许我们在浏览器中创建图形，但是它们在根本上是不同的，如下表格比对列出了他们之间的一些区别：

比对特性	SVG	Canvas
概念	SVG 是一种使用 XML 描述 2D 图形的语言 SVG 基于 XML，这意味着 SVG DOM 中的每个元素都是可用的。您可以为某个元素附加 JavaScript 事件处理器在 SVG 中，每个被绘制的图形均被视为对象。如果 SVG 对象的属性发生变化，那么浏览器能够自动重现图形	Canvas 通过 JavaScript 来绘制 2D 图形 Canvas 是逐像素进行渲染的在 canvas 中，一旦图形被绘制完成，它就不会继续得到浏览器的关注。如果其位置发生变化，那么整个场景也需要重新绘制，包括任何或许已被图形覆盖的对象
分辨率	不依赖分辨率	依赖分辨率
事件支持	支持事件处理器	不支持事件处理器
渲染能力	最适合带有大型渲染区域的应用程序（比如谷歌地图）能够以 .png 或 .jpg 格式保存结果图像	文本渲染能力较弱复杂度高的场景下渲染速度会减慢（任何过度使用 DOM 的应用都不快）
游戏支持	不适合游戏应用	最适合图像/图形密集型的游戏，其中的许多对象会被频繁重绘

作者文档