HTML5新增的十大特性

1、语义化标签
header（头部）、 foot（底部）、nav（导航）、section（定义文档中的章节）、dialog（提示框）、aside（侧边栏）
2、增强型表单
input输入类型： color、date、email、month、number、range（一定范围内数字值的输入域）、search（搜索域）、tel(输入电话号码字段)、time（选择一个时间）、url(url地址的输入域)、week(选择周和年)
表单元素：datalist（元素规定输入域的选项列表，使用 元素的 list 属性与 元素的 id 绑定）、keygen(提供一种验证用户的可靠方法，标签规定用于表单的密钥对生成器字段。)、output（用于不同类型的输出，比如计算或脚本输出）
placehoder 属性，简短的提示在用户输入值前会显示在输入域上。即我们常见的输入框默认提示，在用户输入后消失。
required 属性，是一个 boolean 属性。要求填写的输入域不能为空
pattern 属性，描述了一个正则表达式用于验证 元素的值。
min 和 max 属性，设置元素最小值与最大值。
step 属性，为输入域规定合法的数字间隔。
height 和 width 属性，用于 image 类型的 标签的图像高度和宽度。
autofocus 属性，是一个 boolean 属性。规定在页面加载时，域自动地获得焦点。
multiple 属性 ，是一个 boolean 属性。规定 元素中可选择多个值。
3、视频和音频
提供了播放音频文件的标准,即使用audio元素，control属性供添加、播放、暂停和音量控件
提供了包含视频文件的标准，vedio元素，control提供了播放、暂停、和音量控件来控制视频，可以使用dom操作来控制视频的播放和暂停，如play（）和pause（）方法
4、canvas画图
高斯模糊
5、svg绘图
两者区别：
SVG 是一种使用 XML 描述 2D 图形的语言。
　　Canvas 通过 JavaScript 来绘制 2D 图形。
　　SVG 基于 XML，这意味着 SVG DOM 中的每个元素都是可用的。可以为某个元素附加 JavaScript 事件处理器。
　　在 SVG 中，每个被绘制的图形均被视为对象。如果 SVG 对象的属性发生变化，那么浏览器能够自动重现图形。
　　Canvas 是逐像素进行渲染的。在 canvas 中，一旦图形被绘制完成，它就不会继续得到浏览器的关注。如果其位置发生变化，那么整个场景也需要重新绘制，包括任何或许已被图形覆盖的对象。
6、地理定位
定位用户信息（经纬度）
7、拖放api
dragable属性值为布尔值 ， 拖放的过程分为源对象和目标对象，源对象指自己拖动的对象，目标对象指的是拖动之后要放置的目标位置
拖放的源对象(可能发生移动的)可以触发的事件——3个：
dragstart：拖动开始
drag：拖动中
dragend：拖动结束
整个拖动过程的组成： dragstart1 + dragn + dragend1
拖放的目标对象(不会发生移动)可以触发的事件——4个：
dragenter：拖动着进入
dragover：拖动着悬停
dragleave：拖动着离开
drop：释放
整个拖动过程的组成1： dragenter1 + dragovern + dragleave1
整个拖动过程的组成2： dragenter1 + dragovern + drop*1
dataTransfer：用于数据传递的“拖拉机”对象；
在拖动源对象事件中使用e.dataTransfer属性保存数据：
e.dataTransfer.setData( k, v )
在拖动目标对象事件中使用e.dataTransfer属性读取数据：
var value = e.dataTransfer.getData( k )
8、webworker
运行在后台的js,独立于其他脚本，不影响页面性能
9、Web Storage
使用HTML5可以在本地存储用户的浏览数据。早些时候,本地存储使用的是cookies。但是Web 存储需要更加的安全与快速. 这些数据不会被保存在服务器上，但是这些数据只用于用户请求网站数据上.它也可以存储大量的数据，而不影响网站的性能。数据以 键/值 对存在, web网页的数据只允许该网页访问使用。
客户端存储数据的两个对象为：
localStorage - 没有时间限制的数据存储
sessionStorage - 针对一个 session 的数据存储, 当用户关闭浏览器窗口后，数据会被删除
10、WebSocket
　　WebSocket是HTML5开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。在WebSocket API中，浏览器和服务器只需要做一个握手的动作，然后，浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。浏览器通过 JavaScript 向服务器发出建立 WebSocket 连接的请求，连接建立以后，客户端和服务器端就可以通过 TCP 连接直接交换数据。当你获取 Web Socket 连接后，你可以通过send()方法来向服务器发送数据，并通过onmessage()事件来接收服务器返回的数据。