HTML5
1、HTML5是什么？
HTML5是超文本标记语言的第五次重大修改，2014年10月29日标准规范制定完成。
HTML5的设计目的是为了在移动设备上支持多媒体。新的语法特征被引进以支持这一点，如video、audio和canvas标记。HTML5还引进了新的功能，可以真正改变用户与文档的交互方式，包括：
1. 新的解析规则增强了灵活性
2. 新属性
3. 淘汰过时的或冗余的属性
4. 一个HTML5文档到另一个文档间的拖放功能
5. 离线编辑
6. 信息传递的增强
7. 详细的解析规则
8. 多用途互联网邮件扩展（MIME）和协议处理程序注册
9. 在SQL数据库中存储数据的通用标准（Web SQL）2、HTML5有哪些新特性？
2.1 语义特性
HTML5赋予网页更好的意义和结构。更加丰富的标签将随着对RDFa的，微数据与微格式等方面的支持，构建对程序、对用户都更有价值的数据驱动的Web。
2.2 本地存储特性
基于HTML5开发的网页APP拥有更短的启动时间，更快的联网速度，这些全得益于HTML5 APP Cache，以及本地存储功能。Indexed DB（html5本地存储最重要的技术之一）和API说明文档。
2.3 设备兼容特性
从Geolocation功能的API文档公开以来，HTML5为网页应用开发者们提供了更多功能上的优化选择，带来了更多体验功能的优势。HTML5提供了前所未有的数据与应用接入开放接口。使外部应用可以直接与浏览器内部的数据直接相连，例如视频影音可直接与microphones及摄像头相联。
2.4 连接特性
更有效的连接工作效率，使得基于页面的实时聊天，更快速的网页游戏体验，更优化的在线交流得到了实现。HTML5拥有更有效的服务器推送技术，Server-Sent Event和WebSockets就是其中的两个特性，这两个特性能够帮助我们实现服务器将数据“推送”到客户端的功能。
2.5 网页多媒体特性
支持网页端的Audio、Video等多媒体功能， 与网站自带的APPS，摄像头，影音功能相得益彰。
三维、图形及特效特性（Class: 3D, Graphics & Effects）
基于SVG、Canvas、WebGL及CSS3的3D功能，用户会惊叹于在浏览器中，所呈现的惊人视觉效果。
2.6 性能与集成特性
没有用户会永远等待你的Loading——HTML5会通过XMLHttpRequest2等技术，解决以前的跨域等问题，帮助你的Web应用和网站在多样化的环境中更快速的工作。
2.7 CSS3特性
在不牺牲性能和语义结构的前提下，CSS3中提供了更多的风格和更强的效果。此外，较之以前的Web排版，Web的开放字体格式（WOFF）也提供了更高的灵活性和控制性。
3、HTML5有哪些变化？
HTML5提供了一些新的元素和属性，例如<nav>（网站导航块）和<footer>。这种标签将有利于搜索引擎的索引整理，同时更好的帮助小屏幕装置和视障人士使用，除此之外，还为其它浏览要素提供了新的功能，如<audio>和<video>标记。
- 取消了一些过时的HTML4标记 其中包括纯粹显示效果的标记，如<font>和<center>，它们已经被CSS取代。 HTML5 吸取了XHTML2 一些建议，包括一些用来改善文档结构的功能，比如，新的HTML 标签 header, footer, dialog, aside, figure 等的使用，将使内容创作者更加语义地创建文档，之前的开发者在实现这些功能时一般都是使用div。
- 将内容和展示分离 b 和 i 标签依然保留，但它们的意义已经和之前有所不同，这些标签的意义只是为了将一段文字标识出来，而不是为了为它们设置粗体或斜体式样。u，font，center，strike 这些标签则被完全去掉了
- 一些全新的表单输入对象 包括日期，URL，Email 地址，其它的对象则增加了对非拉丁字符的支持。HTML5 还引入了微数据，这一使用机器可以识别的标签标注内容的方法，使语义Web 的处理更为简单。总的来说，这些与结构有关的改进使内容创建者可以创建更干净，更容易管理的网页，这样的网页对搜索引擎，对读屏软件等更为友好
- 全新的，更合理的Tag 多媒体对象将不再全部绑定在object或 embed Tag 中，而是视频有视频的Tag，音频有音频的 Tag。
- 本地数据库 这个功能将内嵌一个本地的SQL 数据库，以加速交互式搜索，缓存以及索引功能。同时，那些离线Web 程序也将因此获益匪浅。不需要插件的丰富动画。
- Canvas 对象 将给浏览器带来直接在上面绘制矢量图的能力，这意味着用户可以脱离Flash 和Silverlight，直接在浏览器中显示图形或动画。
- 浏览器中的真正程序 将提供 API 实现浏览器内的编辑，拖放，以及各种图形用户界面的能力。内容修饰Tag 将被剔除，而使用CSS。
- Html5取代Flash在移动设备的地位。
- 其突出的特点就是强化了web页的表现性,追加了本地数据库
标签和元素的变化：
1、DOCTYPE
XHTML：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">HTML5：
<!DOCTYPE html>2、文档编码
XHTML：
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />HTML5 ：
<meta charset="UTF-8" />3、标签结尾
在XHTML中没个标签都必需结束，在HTML5中对于一些标签不再是必要的
li 、dt、 dd、 p 、rt、 rp 、optgroup、 option 、colgroup、 thead 、tbody、 tfoot 、tr、 td 、th
自结束的标签最后的/也不再必要
img 、input、 br、 hr 等
4、具有boolean值的属性
对于具有boolean值的属性，例如disabled和readonly等只写属性不写属性值时值为true。
<input type="checkbox" checked >
<input type="checkbox" checked="checked" >
<input type="text" value="China" readonly />
<input type="text" value="China" readonly="readonly" />
<input type="text" disabled />
<input type="text" disabled="disabled" />5、省略属性值的引号
属性值可以用单引号或者双引号，在属性值不包括< 、>、=、'、"时可以忽略引号。
<input type=text >
<input type=text disabled=disabled />4、有哪些新增标签？
元素 | 描述 |
|---|---|
canvas | 标签定义图形，比如图表和其他图像。该标签基于 JavaScript 的绘图 API |
audio | 定义音频内容 |
video | 定义视频（video 或者 movie） |
source | 定义多媒体资源 <video> 和<audio> |
embed | 定义嵌入的内容，比如插件 |
track | 为诸如 <video> 和 <audio> 元素之类的媒介规定外部文本轨道 |
datalist | 定义选项列表。与 input 元素配合使用该元素，来定义 input 可能的值 |
keygen | 规定用于表单的密钥对生成器字段 |
output | 定义不同类型的输出，比如脚本的输出 |
article | 定义页面正文内容 |
aside | 定义页面内容之外的内容 |
bdi | 设置一段文本，使其脱离其父元素的文本方向设置 |
command | 定义命令按钮，比如单选按钮、复选框或按钮 |
details | 用于描述文档或文档某个部分的细节 |
dialog | 定义对话框，比如提示框 |
summary | 标签包含 details 元素的标题 |
figure | 规定独立的流内容（图像、图表、照片、代码等等） |
figcaption | 定义 <figure> 元素的标题 |
footer | 定义 section 或 document 的页脚 |
header | 定义了文档的头部区域 |
mark | 定义带有记号的文本 |
meter | 定义度量衡。仅用于已知最大和最小值的度量 |
nav | 导航 |
progress | 定义任何类型的任务的进度 |
ruby | 定义 ruby 注释（中文注音或字符） |
rt | 定义字符（中文注音或字符）的解释或发音 |
rp | 在 ruby 注释中使用，定义不支持 ruby 元素的浏览器所显示的内容 |
section | 定义文档中的节（section、区段） |
time | 定义日期或时间 |
wbr | 规定在文本中的何处适合添加换行符 |
5、如何让低版本的 IE 支持 HTML5新标签？
让ie6-ie9等低版本支持html5新标签的方法：在head中加上下面这段代码：
image.png
html5shiv.js下载地址：https://github.com/aFarkas/html5shiv
6、input 有哪些新增类型？
- url
- number
- range
- Date Picker
- Date
- month
- week
- time
- datatime
7、浏览器本地存储中 cookie 和 localStorage 有什么区别？ localStorage 如何存储删除数据？
特性 | Cookie | localStorage |
|---|---|---|
数据的生命期 | 一般由服务器生成，可设置失效时间。如果在浏览器端生成Cookie，默认是关闭浏览器后失效 | 除非被清除，否则永久保存 |
存放数据大小 | 4K左右 | 一般为5MB |
与服务器端通信 | 每次都会携带在HTTP头中，如果使用cookie保存过多数据会带来性能问题 | 仅在客户端（即浏览器）中保存，不参与和服务器的通信 |
易用性 | 需要程序员自己封装，源生的Cookie接口不友好 | 源生接口可以接受，亦可再次封装来对Object和Array有更好的支持 |
localStorage存储删除数据：
//增改
localStorage.setItem('name','zzz');
//删
localStorage.removeItem('name');
//查
localStorage.getItem('name');
//清除所有数据
localStorage.clear();