一、新增标签
1、网页结构语义化标签（8个）：
- header，用于展示介绍性内容或是辅助导航
- nav，网页导航栏
- section，类似于一篇文章独立的章节，是article的一部分（个人理解）
- article，类似于一篇独立的文章（个人理解）
- aside，侧边栏，多见于侧边导航栏（个人理解）
- figure，文章的补充部分，该部分的缺失应该不影响主体内容价值流失
- figcaption，figure标签内的标题
- footer，页脚，通常包含作者信息、版权数据、相关链接等
2、自定义图形标签canvas
配合js来完成图像or文字的绘制
3、可伸缩矢量图形svg（这名字我也搞不懂0.0）
配合样式css来完成图像绘制
4、数学语言标签math
通过math嵌套其他数学标签可以完成数学公式的编写
5、媒体标签
1、视频标签video
属性：autoplay、controls、长宽、loop、muted、poster、src
还有相对应js事件，如playPause
子标签：source资源标签、track字幕标签
2、音频标签audio
属性：auto play、controls、loop、preload、src
子标签：source资源标签
3、资源标签source
属性：src、type="video/xx.mp4"
6、新增input类型（13个，只列举部分）：定义input标签中type的属性值
1、选择颜色：<input type="color" name="favcolor">
2、选择年月日：<input type="date" name="bday">年月日
3、填写数字：<input type="number" name="quantity" min="1" max="5">，min max属性限制填写范围
4、条状数字表：<input type="range" name="points" min="1" max="10">
5、搜索框：<input type="range" name="points" min="1" max="10">类似文本框
6、电话号：<input type="tel" name="usrtel">
7、时间表：<input type="time" name="usr_time">
8、网址：<input type="url" name="homepage">
7、自动完成列表datalist
效果：通常配合文本框使用，类似在百度搜索框输入搜索内容时弹出的联想搜索内容
使用规则：用input中datalist属性指定一个自动完成列表标签datalist的id号，即input中list属性值和datalist中id属性值保持一致，用单元素标签option中value值完成联想内容，示例如下：
<input list="browsers" name="browser" type="text">
<datalist id="browsers">
<option value="Internet Explorer">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist>
8、输出标签output
使用规则：
第一步、output属性name定义变量x
第二步、定义参与运算的input标签中的属性name为其他变量，如a、b
第三步、在form标签中oninput属性指定运算规则，如a+b=m
第四步、运算结果会出现output标签内，并且会替代output标签内所有内容，如output内部原来只有一个a链接标签，但是输入a、b两值后，output内部只有运算结果
示例如下：
<form οninput="x.value=parseInt(a.value)+parseInt(b.value)">
<input type="number" name="a"> + <input type="number" name="b">=
<output name="x"><a href="#">百度一下<a/></output></form>
9、插件标签object、embed（补充）
1、object: <object width="100%" height="500px" data="snippet.html">图片丢失</object> ，data属性值指定插件文
件
2、embed： <embed src="audi.jpeg" /> 单标签，不能使用替代文本
二、新增对象
1、Web本地存储：以键值对的方式保存在本地用户端中
1、localStorage：需要手动删除
常用方法：
保存数据localStorage.setItem(key,value);
读取数据localStorage.getItem(key);
删除某个数据localStorage.removeItem(key);
删除所有数据localStorage.clear();
2、sessionStorage：关闭某一页面后就会删除
常用方法：存、读、删、清楚所有，与上文类似
2、openDatabase创建数据库
可在网页中直接操作数据库
3、后台运行脚本Worker：页面在执行脚本时是无法响应用户的，如用户不能点击链接等。但是使用后台脚本就可以解决上述问题。
使用规则：
第一步、创建外部执行的脚本js
第二步、创建Worker对象：var w = Worker("./xxx.js");
第三步、利用事件监听等触发后台脚本：w.onclick
第四步、后台脚本停止w.terminate()
4、Socket对象：浏览器和服务器只需要做一个握手的动作，两者之间就直接可以数据互相传送。
var Socket = new WebSocket(url, [protocol] );
知识待补充……
三、代码规范
1、H5的html文档声明：<!DOCTYPE html>
2、编写标签和属性时用小写：<a href="#">记得用小写</a>
3、标签属性值要加引号：<img src="./xx.png" />
4、所有标签都需要关闭：<p></p> or <img />
5、嵌套标签使用缩进，一行尽量少于80个字符
6、使用注释
四、需加强的知识点：
1、加强对新增的8个网页结构语义化标签理解
2、如有工作需要，进行canvas、svg、math等标签的学习
3、有一定js基础后，需要回顾Woker、Socket等新增对象
注：该文章内容参考MDN文档和菜鸟教程官方网站菜鸟教程 - 学的不仅是技术，更是梦想！并且结合自己的理解所作出，仅供参考。如有不当之处，望指正！么么哒！
