H5新特性总结

1、语义化标签

   <hrader></header> 定义了文档的头部区域

   <footer></footer>  定义了文档的尾部区域

      <nav></nav> 定义文档的导航

    <section></section> 定义文档中的节(section、区段)

  <article></article>定义页面独立的内容区域

  <aside></aside>  定义页面的侧边栏内容

  <detailes></detailes> 用于描述文档或文档某个部分的细节

      <summary></summary>  标签包含 details 元素的标题

  <dialog></dialog>  定义对话框,比如提示框

2、新增表单元素

  datalist、keygen、output  

  例:<datalist id="url_list">
      <option label="W3School" value="http://www.w3school.com.cn" />
      <option label="Google" value="http://www.google.com" />
      <option label="Microsoft" value="http://www.microsoft.com" />
         </datalist>

 3、增强型表单 input输入类型

  表单 Input 的 type类型增加 

  如:number、tel、email、range、search、color、date、datetime、month、week、url

4、表单属性值 

  autocomplete(拥有自动完成功能)、autofocus(自动聚焦)、

  placeholder、required、height 、 width、min, max 和 step(合法的数字间隔)、multiple(多选)、pattern (regexp) 

5、音频和视频

 <audio src="/i/song.ogg" controls="controls"></audio>

<video src="movie.ogg" controls="controls"></video>

 5、画布canvas

  <canvas id="myCanvas" width="200" height="100" style="border:1px solid #000000;"></canvas>

6、地理定位

   Geolocation(地理定位)用于定位用户的位置

8、拖放API

  拖放(Drag 和 drop)是 HTML5 标准的组成部分。

9、web 存储 

  HTML5 提供了两种在客户端存储数据的新方法:

  localStorage - 没有时间限制的数据存储

  sessionStorage - 针对一个 session 的数据存储

10、web workers

  web worker 是运行在后台的 JavaScript,不会影响页面的性能。

11、WebSocket

原文地址:https://www.cnblogs.com/xiaoxiao2017/p/13304972.html