html5

1、拖拽事件

（1）概念
具有拖动物体、投放区两个注意点。

（2）拖动物体事件（关注鼠标动作）

• ondragstart
• ondrag
• ondragend

（3）投放区事件（关注拖动物体相对于投放区的位置）

• ondragenter
• ondragover
• ondragleave
• ondrop（需要配合ondragover使用，先绑定ondragover事件再取消其默认行为，ondrop内程序才会生效）

2、多媒体

• 视频：mp4、ogg、webm
• 音频：mp3、ogg、wav

3、地理位置

各种API返回相关的地理位置信息，需要GPS、WIFI、IP等条件。（只有在专门做定位需求时才会用到）

4、本地存储（量大、相对安全）

用于存储浏览记录相关信息。

• localStorage：保存数据直到手动清除浏览器记录。
• sessionStorage：保存数据直到会话结束，与cookie有联系，也可以设置失效时间。

上述两个方式仅用于客户端，而cookie方式则可以存在与客户端和服务器端。

5、web SQL

即存在于本地的数据库，常用于侧重数据关系的网页，可以当做更强大的本地存储。

6、离线缓存

用于存储URL资源，以防断网导致空页面，可以通过设置配置文件更改缓存规则。

7、websocket协议

特点

• 相对于http协议，它是一种持续性协议，请求头有部分区别
• 相对于ajax轮询，它会使BS之间，只有当有数据更新时，才发送请求，减轻服务器压力

请求原理
发送一次http请求，若服务器支持websocket协议，则之后保持连接，在断开之前，一直采用websocket协议进行通信。

8、web worker

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

9、Server-Sent Events

• Server-Sent 事件指的是网页自动获取来自服务器的更新。
• 以前也可能做到这一点，前提是网页不得不询问是否有可用的更新。通过服务器发送事件，更新能够自动到达。