HTML5是什么？有哪些新特性？有哪些新增標簽？如何讓低版本的 IE 支持 HTML5新標簽
HTML5是超文本標記語言的第五次重大修改，2014年10月29日標準規范制定完成
特點：
- HTML5的設計目的是為了在移動設備上支持多媒體。
- HTML5賦予網頁更好的意義和結構。
- 基于HTML5開發的網頁APP擁有更短的啟動時間，更快的聯網速度
新增元素
| 元素 | 描述 |
|---|---|
| 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 | 規定在文本中的何處適合添加換行符 |
兼容老IE
可以使用 html5shiv.js 這個庫使得以前版本的瀏覽器支持html5.
<!--[if lt IE 9]>
<script src="bower_components/html5shiv/dist/html5shiv.js"></script>
<![endif]-->
input 有哪些新增類型？
- color 用于指定顏色
- email 用于編輯email的字段
- url 用于編輯URL的字段
- number 用于輸入浮點數
- range 用于輸入不精確值，如果未指定相應的屬性，控件使用如下缺省值：
- min：0
- max：100
- value：min + (max-min)/2，或者當max小于min時使用min
- step：1
- search 用于輸入搜索字符串的單行文本字段。換行會被從輸入的值中自動移除。
- tel 用于輸入電話號碼
- Date Picker
- date 用于輸入日期（年、月、日，不包括時間）
- month 用于輸入年月，不帶時區
- week 用于輸入由星期-年組成的日期，不帶時區
- time 用于輸入不含時區的時間控件
- datetime 基于 UTC 時區的日期時間輸入控件（時，分，秒及幾分之一秒）
- datetime-local 用于輸入日期時間控件，不包含時區。
瀏覽器本地存儲中 cookie 和 localStorage 有什么區別？ localStorage 如何存儲刪除數據。
image.png
<body>
<input type='button' onclick='setItems()' value='存值' />
<input type='button' onclick='getItems()' value='取值' />
<input type='button' onclick='deleteItem()' value='刪除' />
</body>
<script src="js/jquery.min.js"></script>
<script>
//localStorage存值永久有效
function setItems(){
var user = {};
user.name = 'Adam Li';
user.age = 25;
user.home = 'China';
localStorage.setItem('userinfo',JSON.stringify(user));
}
//localStorage取值
function getItems(){
var data = JSON.parse(localStorage.getItem('userinfo'));
console.log("name:"+data.name+'\r age:'+data.age+"\r home:"+data.home);
}
//localStorage刪除指定鍵對應的值
function deleteItem(){
localStorage.removeItem('userinfo');
console.log(localStorage.getItem('userinfo'));
}
</script>
