HTML5 有哪些新特性？

• 增強(qiáng)了圖片渲染镜遣、數(shù)據(jù)存儲(chǔ)巡揍、影音和多任務(wù)處理等功能
• 新加的屬性是：
  • canvas 動(dòng)畫
• 本地存儲(chǔ) localstorage
• 事件監(jiān)聽 addeventlistener（window 的對(duì)象）
• sessionstorage 數(shù)據(jù)在瀏覽器關(guān)閉后自動(dòng)刪除
• 媒體 video 和 audio
  • 需要第三方插件就能播放音頻和視頻了钧忽，可以直接插入，并且用同一的 API 接口控制
• 語(yǔ)義化的標(biāo)簽
  • 語(yǔ)義化的標(biāo)簽對(duì)搜索引擎優(yōu)化有好處瘟则，更易被搜索到。其他的同事維護(hù)代碼也很方便一點(diǎn)
• 表單的控制
  • email枝秤、time醋拧、search
• Geolocation 地理定位
  • 地理定位（這個(gè)目前我接觸的少不太清楚）

localStorage 、 sessionStorage 與 cookie 有哪些區(qū)別淀弹。

• 基本概念：
  • cookie：是網(wǎng)景公司的前雇員在 1993 年發(fā)明丹壕。它的主要用于保存登陸信息，比如登陸某個(gè)網(wǎng)站市場(chǎng)可以看到'記住密碼'薇溃，這就是通過(guò)在 cookie 中存入一段辨別用戶身份的數(shù)據(jù)來(lái)實(shí)現(xiàn)的
  • sessionStorage：會(huì)話菌赖，是可以將一部分?jǐn)?shù)據(jù)在當(dāng)前會(huì)話中保存下來(lái)，刷新頁(yè)面數(shù)據(jù)依舊存在沐序。但是頁(yè)面關(guān)閉后琉用，sessionStorage 中的數(shù)據(jù)就會(huì)被清空
  • localStorage：是 HTML5 標(biāo)準(zhǔn)中新加入的技術(shù)堕绩，當(dāng)然早在 IE6 時(shí)代就有一個(gè) userData 的東西用于本地存儲(chǔ)，而當(dāng)時(shí)考慮到瀏覽器的兼容性邑时，更通用的方案是使用 flash奴紧。如今localStorage 被大多數(shù)瀏覽器所支持
• 三者區(qū)別：
  1. 存儲(chǔ)大小
     • cookie：一般不超過(guò) 4K（因?yàn)槊看?http 請(qǐng)求都會(huì)攜帶 cookie、所以 cookie 只適合保存很小的數(shù)據(jù)晶丘，如會(huì)話標(biāo)識(shí)）
     • sessionStorage：5M 或者更大
     • localStorage：5M 或者更大
  2. 數(shù)據(jù)有效期
     • cookie：一般由服務(wù)器生成黍氮，可以設(shè)置失效時(shí)間；若沒有設(shè)置時(shí)間浅浮，關(guān)閉瀏覽器 cookie 失效沫浆，若設(shè)置了時(shí)間，cookie 就會(huì)存放在硬盤里脑题，過(guò)期才失效
     • sessionStorage：僅在當(dāng)前瀏覽器窗口關(guān)閉之前有效件缸，關(guān)閉頁(yè)面或者瀏覽器會(huì)被清除
     • localStorage：永久有效，窗口或者瀏覽器關(guān)閉也會(huì)一直保存叔遂，除非手動(dòng)永久清除他炊，因此用作持久數(shù)據(jù)
  3. 作用域
     • cookie：在所有同源窗口中都是共享的
     • sessionStorage：在同一個(gè)瀏覽器窗口是共享的（不同瀏覽器、同一個(gè)頁(yè)面也是不共享的）
     • localStorage：在所有同源窗口中都是共享的
  4. 通信
     • cookie：十種攜帶在同源的http請(qǐng)求中已艰，即使不需要痊末，故 cookie 在瀏覽器和服務(wù)器之間來(lái)回傳遞；如果使用 cookie 保存過(guò)多數(shù)據(jù)會(huì)造成性能問(wèn)題
     • sessionStorage：僅在客戶端（即瀏覽器）中保存哩掺，不參與和服務(wù)器的通信凿叠；不會(huì)自動(dòng)把數(shù)據(jù)發(fā)送給服務(wù)器，僅在本地保存
     • localStorage：僅在客戶端（即瀏覽器）中保存嚼吞，不參與和服務(wù)器的通信盒件；不會(huì)自動(dòng)把數(shù)據(jù)發(fā)送給服務(wù)器，僅在本地保存
  5. 易用性
     • cookie：需要自己進(jìn)行封裝舱禽，原生的 cookie 接口不夠友好
     • sessionStorage：原生接口可以接受炒刁，可以封裝來(lái)對(duì) Object 和 Array 有更好的支持
     • localStorage：原生接口可以接受，可以封裝來(lái)對(duì) Object 和 Array 有更好的支持
• 應(yīng)用場(chǎng)景
  • cookie：判斷用戶是否登錄過(guò)網(wǎng)站誊稚，以便實(shí)現(xiàn)下次自動(dòng)登錄或記住密碼翔始；保存事件信息等
  • sessionStorage：敏感賬號(hào)一次性登錄；單頁(yè)面用的較多（sessionStorage 可以保證打開頁(yè)面時(shí) sessionStorage 的數(shù)據(jù)為空）
  • localStorage：常用于長(zhǎng)期登錄（判斷用戶是否已登錄）里伯，適合長(zhǎng)期保存在本地的數(shù)據(jù)

列舉語(yǔ)義化標(biāo)簽城瞎，并說(shuō)明使用語(yǔ)義化標(biāo)簽的好處。

• 語(yǔ)義化標(biāo)簽：
  • 盡可能少的使用 div, span 等無(wú)意義的標(biāo)簽疾瓮，div 和 span 沒有含義脖镀，也因此十分適合作為容器標(biāo)簽
  • 盡量不要使用純樣式標(biāo)簽如 <font><b><u> 等，用 css 替代
  • 需要強(qiáng)調(diào)的地方狼电，可以使用 strong 和 em认然，不要使用 b
  • label for 標(biāo)簽的使用补憾，將輸入框和對(duì)應(yīng)文字聯(lián)系起來(lái)
  • alt 除了做圖片解釋以外，可以作為頁(yè)面未加載出來(lái)的文字
  • 使用 br 增加行間距的行為是錯(cuò)誤的卷员，<br /> 標(biāo)簽主要用于文本內(nèi)容換行
  • 表格的 caption,thead,tbody 等的使用
  • html5 新加的語(yǔ)義化標(biāo)簽盈匾，如 <header>,<aside>,<article>,<section>,<footer>,<nav> 等
• 語(yǔ)義化標(biāo)簽好處：
  • 因?yàn)橄癫糠謽?biāo)簽自帶樣式如 h1-h6 系列，p 等毕骡，使用語(yǔ)義化的標(biāo)簽可以在樣式加載不出的時(shí)候有基本樣式削饵，而不顯混亂
  • 有利于 SEO，語(yǔ)義化標(biāo)簽可以有利于爬蟲抓取到網(wǎng)頁(yè)未巫，因?yàn)榕老x依賴于標(biāo)簽來(lái)確定上下文和各個(gè)關(guān)鍵字的權(quán)重窿撬。
  • 有利于一些特殊設(shè)備的解析，比如盲人閱讀器叙凡，這為他們?yōu)g覽網(wǎng)頁(yè)帶來(lái)了便利
  • 代碼可讀性良好劈伴，便于代碼維護(hù)