HTML5新特性整理

1.HTML5 新元素

HTML5提供了新的元素来创建更好的页面结构：
我这边筛选了部分常用的元素

元素	作用
	定义页面独立的内容区域。
	定义页面的侧边栏内容。
	定义 section 或 document 的页脚。
	定义了文档的头部区域
	定义导航链接的部分。
	定义任何类型的任务的进度。
	规定在文本中的何处适合添加换行符。
	定义文档中的节（section、区段）。
	定义任何类型的任务的进度。
	定义 ruby 注释（中文注音或字符）。

2.HTML5 Canvas

HTML5

3.元素拖放

拖放是一种常见的特性，即抓取对象以后拖到另一个位置。
在 HTML5 中，拖放是标准的一部分，任何元素都能够拖放。
①设置元素为可拖放
首先，为了使元素可拖动，把 draggable 属性设置为 true ：

②其他相关事件：
拖动什么 - ondragstart 和 setData()
放到何处 - ondragover
进行放置 - ondrop

4.HTML5 地理定位

HTML5 Geolocation API 用于获得用户的地理位置。
鉴于该特性可能侵犯用户的隐私，除非用户同意，否则用户位置信息是不可用的。

5.HTML5 Audio(音频)、Video(视频)

HTML5 规定了在网页上嵌入音频元素的标准，即使用

HTML5 规定了一种通过 video 元素来包含视频的标准方法。

6.HTML5 Input 类型

HTML5 拥有多个新的表单输入类型。这些新特性提供了更好的输入控制和验证。

color、date、datetime、datetime-local、email、month、number、range、search、tel、time、url、week


Search Google: 
电话号码:

7.HTML5 Web 存储

Web Storage DOM API 为Web应用提供了一个能够替代cookie的Javascript解决方案

sessionStorage—客户端数据存储，只能维持在当前会话范围内。
sessionStorage 方法针对一个 session 进行数据存储。当用户关闭浏览器窗口后，数据会被删除。
localStorage—客户端数据存储，能维持在多个会话范围内。
localStorage 对象存储的数据没有时间限制。第二天、第二周或下一年之后，数据依然可用。
对于大量复杂数据结构，一般使用IndexDB

8.HTML5 离线Web应用（应用程序缓存）

HTML5 引入了应用程序缓存，这意味着 web 应用可进行缓存，并可在没有因特网连接时进行访问。

应用程序缓存为应用带来三个优势：

离线浏览 - 用户可在应用离线时使用它们
速度 - 已缓存资源加载得更快
减少服务器负载 - 浏览器将只从服务器下载更新过或更改过的资源。

9.HTML5 Web Workers

当在 HTML 页面中执行脚本时，页面的状态是不可响应的，直到脚本已完成。
web worker 是运行在后台的 JavaScript，独立于其他脚本，不会影响页面的性能。您可以继续做任何愿意做的事情：点击、选取内容等等，而此时 web worker 在后台运行。（相当于实现多线程并发）

10.HTML5 WebSocket

WebSocket是HTML5开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。在WebSocket API中，浏览器和服务器只需要做一个握手的动作，然后，浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。浏览器通过 JavaScript 向服务器发出建立 WebSocket 连接的请求，连接建立以后，客户端和服务器端就可以通过 TCP 连接直接交换数据。当你获取 Web Socket 连接后，你可以通过 send() 方法来向服务器发送数据，并通过 onmessage 事件来接收服务器返回的数据。以下 API 用于创建 WebSocket 对象。

其他

包括一些css3的内容，动画，暂不讨论。