第2章 HTML5 JavaScript概述以及新特性
2.1 HTML5概述
HTML5已经推出，Web也不会是一成不变的。
以前你一定听说过这句话或类似的内容。 我想，当你听到这句话时，可能会变得很激动，转动眼珠、皱着眉头一脸疑问。 也可能这三种反应你都有。有这些反应，我非常能理解。 HTML5 十分令人称道，正如我们所知，它可能会改变 Web，但它的作用也被夸大了。 而且，它的真正意义还难以琢磨。 在使用 HTML5 构建应用程序时，我自己也有过上面所说的每一种反应。 HTML5 是一个宽泛的话题，要掌握它很困难，更不用说知道从哪里开始使用这套激动人心的新技术了。
2.1.1 什么是HTML5
到现在为止，你可能会发现HTML5对不同的人有着不同的意义。 对有些人来说，它只意味着诸如和之类的新标记以及可用在标记中的一些新属性。 对另一些人来说，它意味着Web上一切崭新和有趣的功能，包括在单个浏览器中实现的技术或未正式包含在HTML5中的其他规范。 当然，了解HTML5的真正意义通常是很多人面临的第一个障碍。
坦率地讲，存在各种各样的定义是有道理的。 HTML5十分庞大！ HTML5由国际标准团体万维网联盟（W3C）正式定义，包含与下一代Web技术相关的100多项规范。 将所有这100多项规范统称为HTML5，您可能会认为W3C过度简化了这些规范的定义。HTML5涉及的内容非常广泛，很难为它下一个合适的明确定义。我认为 W3C 是通过引入HTML5作为Web变化的统一概念，从而界定这种变化的范围。
实际上，HTML5是描述一组HTML、CSS和JavaScript规范的泛称，这些规范旨在帮助开发人员构建下一代网站和应用程序。 这个定义主要由3部分组成：HTML、CSS 和 JavaScript。这3部分规定开发人员如何使用改进的标记、更丰富的样式功能以及新的JavaScript API以充分利用新Web开发功能。
简单地说，HTML5 = HTML + CSS + JavaScript。
就是这样。HTML5是关于对HTML、CSS和JavaScript的更改的。这3个术语描述了HTML5的广度和范围，你不必担心所有这100多条规范。还是认为这有点简略？ 可能是这样，但你很快会明白，全面的HTML5定义并不像你选择采用的技术那样重要，因为这些技术值得你花费时间和精力。
以下几小节我们将介绍HTML5的重要新特性。
2.1.2 新的文档类型
目前很多网页还在使用XHTML1.0，并且要在第一行像这样声明文档类型：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/ xhtml1/DTD/xhtml1-transitional.dtd">
在HTML5中，上面的声明方式将失效。HTML5的声明方式为：
<!DOCTYPE html>
HTML4.01中的DOCTYPE需要对DTD进行引用，因为HTML4.01基于SGML。而HTML5不基于SGML，因此不需要对DTD进行引用，但是需要DOCTYPE来规范浏览器的行为。需要注意的是DOCTYPE对大小写很敏感，请书写时注意大小写。
2.1.3 脚本和链接无需添加type属性
在HTML4或XHTML中，你需要用下面的两行代码来给你的网页添加CSS和JavaScript文件。
<link rel="stylesheet" href="path/to/stylesheet.css" type="text/css" />
<script type="text/javascript" src="path/to/script.js"></script>
而在HTML5中，你不再需要指定类型属性。因此，代码可以简化如下：
<link rel="stylesheet" href="path/to/stylesheet.css" />
<script src="path/to/script.js"></script>
2.1.4 用于绘画的画布（canvas元素）
HTML5的canvas元素使用JavaScript在网页上绘制图像。画布是一个矩形区域，你可以控制其每一个像素。canvas拥有多种绘制路径、矩形、圆形、字符以及添加图像的方法。
2.1.5 用于媒介播放的video和audio元素
我们无需再依赖第三方插件区渲染音频。HTML5提供了
<audio autoplay="autoplay" controls="controls">
<source src="file.ogg" />
<source src="file.mp3" />
<a href="file.mp3">Download this file.</a>
</audio>
Mozilla和WebKit还没有完全相处，当涉及音频格式时，Firefox会希望看到一个.ogg文件，而WebKit的浏览器支持.mp3扩展。这意味着，至少在现在，你应该创建两个版本的音频。当Safari加载页面时，它不会承认.ogg格式，将会跳过它并转移到MP3版本。
2.1.6 新的特殊内容元素
< article>< /article>
用于定义独立的内容，比如，论坛帖子、报纸文章、博客条目、用户评论。标签的内容独立于文档的其余部分。
< footer>< /footer>
用于定义section或document的页脚。在典型情况下，该元素会包含创作者的姓名、文档的创作日期以及联系信息。假如，你使用footer来插入联系信息，应该在footer元素内使用< address>元素。
< header>< /header>
用于定义文档的页眉（介绍信息）。
< nav>< /nav>
定义导航链接的部分。如果文档中有“前后”按钮，则应该把它放到< nav>元素中。
< section>< /section>
用于定义文档中的节，比如，章节、页眉、页脚或文档中的其他部分。
2.1.7 新的表单控件
HTML5拥有多个新的表单输入类型。这些新特性提供了更好的输入控制和验证。
数据检出器
HTML5拥有多个可供选取日期和时间的新输入类型，date、month、week、time、datetime、datetime-local。
email
用于应该包含E-mail地址的输入域。在提交表单时，会自动验证email域的值。例如：
E-mail:< input type=”email” name=”user_email”>
url
用于应该包含URL地址的输入域。在提交表单时，会自动验证URL域的值。
search
用于搜索域，比如站点搜索或Google搜索。search域显示为常规文本域。