- <h3>1. 增加新的语义化标签</h3>
- <h3>2. input 增加新属性 </h3>
类型 | 描述 |
---|---|
datetime | 选取日期和时间(包括年,月,日,时,分,秒,分秒) |
datetime-local | 日期和时间(包括年,月,日,时,分,秒,分秒)本地时间 |
date | 选取时间(包括年,月,日) |
month | 年和月组成的日期 |
week | 年和星期数组成的日期 |
time | 时间(包括时,分,秒,和分秒) |
number | 只接受数值 |
range | 必须输入一定范围内数值 |
只接受邮箱值 | |
url | 只接受 URL 值 |
<h3>3.html5 提供了两种在客户端存储数据的新方法</h3>
3.1 localStorage - 没有时间限制的数据存储
3.2 sessionStorage - 针对一个 session 的数据存储
<h3>4.web Worker</h3>
4.1 什么是 Web Worker?
当在 HTML 页面中执行脚本时, 页面的状态是不可响应的, 直到脚本已完成
web worker 是运行在后台的 JavaScript, 独立于其他脚本, 不会影响页面的性能您可以继续做任何愿意做的事情: 点击选取内容等等, 而此时 web worker 在后台运行
4.2 Web Workers 和 DOM
由于 web worker 位于外部文件中, 它们无法访问下例 JavaScript 对象:
window 对象
document 对象
parent 对象
<h3>5. 服务器推送事件</h3>
传统的更新是网页询问是否有可更新的内容, 而 H5 的 Server-Sent 事件是网页自动获取来自服务器的更新
<h3>6.Canvas</h3>
H5 提供了 Canvas 画布的功能, 可以完成图像的绘画
<h3>7. 音频和视频</h3>
HTML5 DOM 为 <audio> 和 <video> 元素提供了方法属性和事件
这些方法属性和事件允许使用 JavaScript 来操作 <audio> 和 <video> 元素
<h3>8. 地理定位</h3>
HTML5 Geolocation API 允许我们对喜欢的网站共享我们的位置 JavaScript 可以捕获到纬度和经度, 还可以发送给后端服务器, 然后做一些位置感知的事情, 比如查找本地企业或者在地图上显示我们的位置
<h3>9. 拖放</h3>
H5 让拖放变的更加便捷:
9.1 创建一个可拖拽对象
a. 如果想要拖动某个元素, 需要设置元素的 draggable 属性为 true
b. 给 dragstart 设置一个事件监听器存储拖拽数据
c. 事件监听器 dragstart 会设置允许的效果(copy,move,link 或者是组合形式的)
9.2: 放置对象
a .dragenter 事件, 用来确定放置目标是否接受放置如果放置被接受, 那么这个事件必须取消
b. dragover 事件, 用来确定给用户显示怎样的反馈信息如果这个事件被取消, 反馈信息 (通常就是光标) 就会基于 dropEffect 属性的值更新
c. 最后是 drop 事件, 允许执行真是的放置
来源: http://www.jianshu.com/p/ec49057617d5