題目1： HTML5是什么孝赫？有哪些新特性较木？有哪些新增標(biāo)簽？如何讓低版本的 IE 支持 HTML5新標(biāo)簽
- HTML5 是 HTML 的第五次重大修改青柄，設(shè)計(jì)目的是為了在移動(dòng)設(shè)備上支持多媒體劫映。
- 新特性:
- 語(yǔ)義特性
- 本地存儲(chǔ)特性（localStorage Indexed DB）
- 設(shè)備兼容特性（Geolocation功能）
- 連接特性（實(shí)時(shí)特性，webSockets）
- 網(wǎng)頁(yè)多媒體特性（Audio Vedio Canvas SVG）
- 性能與集成特性（XMLHttpRequest2等技術(shù)）
- CSS3特性
- 新增標(biāo)簽：header nav footer article section aside dialog audio vedio
- 讓低版本的 IE 支持 HTML5新標(biāo)簽
- 這段代碼僅會(huì)在IE瀏覽器下運(yùn)行刹前，還有一點(diǎn)需要注意泳赋，在頁(yè)面中調(diào)用html5.js文件必須添加在頁(yè)面的head元素內(nèi)，因?yàn)镮E瀏覽器必須在元素解析前知道這個(gè)元素喇喉，所以這個(gè)js文件不能在頁(yè)面底部調(diào)用.
<!--[if IE]><script src=”http://html5shiv.googlecode.com/svn/trunk/html5.js”></script> <![endif]-->
- 在hmtl 加入（推薦）
除了在網(wǎng)頁(yè)中調(diào)用包含以上代碼的js文件來讓IE瀏覽器支持HTML5元素以外祖今，你也可以以下面這種方式把代碼直接添加到網(wǎng)頁(yè)中。
<!--[if lt IE 9]>
<script>
(function(){if(!/*@cc_on!@*/0)return;var e = “abbr,article,aside,audio,canvas,datalist,details,dialog,eventsource,figure,footer,header,hgroup,mark,menu,meter,nav,output,progress,section,time,video”.split(’,'),i=e.length;while(i–){document.createElement(e[i])}})()
</script>
<![endif]-->
題目2： input 有哪些新增類型拣技？
- email 輸入的郵箱要滿足郵箱地址的規(guī)范 @...
- url 輸入的連接要滿足連接的規(guī)范 http://...
- number 輸入的是數(shù)字才有效千诬，輸入其他無效
- range 變成一個(gè)百分比條
- datepicker 直接日期選擇
題目3： 瀏覽器本地存儲(chǔ)中 cookie 和 localStorage 有什么區(qū)別？ localStorage 如何存儲(chǔ)刪除數(shù)據(jù)膏斤。
-
localStorage帶來的好處：
- 減少網(wǎng)絡(luò)流量：一旦數(shù)據(jù)保存在本地后徐绑，就可以避免再向服務(wù)器請(qǐng)求數(shù)據(jù)，因此減少不必要的數(shù)據(jù)請(qǐng)求莫辨，減少數(shù)據(jù)在瀏覽器和服務(wù)器間不必要地來回傳遞傲茄。
- 快速顯示數(shù)據(jù)：性能好毅访，從本地讀數(shù)據(jù)比通過網(wǎng)絡(luò)從服務(wù)器獲得數(shù)據(jù)快得多，本地?cái)?shù)據(jù)可以即時(shí)獲得盘榨。再加上網(wǎng)頁(yè)本身也可以有緩存喻粹，因此整個(gè)頁(yè)面和數(shù)據(jù)都在本地的話，可以立即顯示草巡。
- 臨時(shí)存儲(chǔ)：很多時(shí)候數(shù)據(jù)只需要在用戶瀏覽一組頁(yè)面期間使用守呜，關(guān)閉窗口后數(shù)據(jù)就可以丟棄了，這種情況使用sessionStorage非常方便山憨。
共同點(diǎn)：都是保存在瀏覽器端查乒，且同源的。
-
區(qū)別
- cookie數(shù)據(jù)始終在同源的http請(qǐng)求中攜帶（即使不需要）郁竟，即cookie在瀏覽器和服務(wù)器間來回傳遞侣颂。cookie數(shù)據(jù)還有路徑（path）的概念，可以限制cookie只屬于某個(gè)路徑下枪孩。存儲(chǔ)大小限制也不同憔晒，cookie數(shù)據(jù)不能超過4k，同時(shí)因?yàn)槊看蝖ttp請(qǐng)求都會(huì)攜帶cookie蔑舞，所以cookie只適合保存很小的數(shù)據(jù)拒担，如會(huì)話標(biāo)識(shí)。cookie只在設(shè)置的cookie過期時(shí)間之前一直有效攻询，即使窗口或?yàn)g覽器關(guān)閉从撼。cookie也是在所有同源窗口中都是共享的钧栖。
- 而sessionStorage和localStorage不會(huì)自動(dòng)把數(shù)據(jù)發(fā)給服務(wù)器低零，僅在本地保存。sessionStorage和localStorage 雖然也有存儲(chǔ)大小的限制拯杠，但比cookie大得多掏婶，可以達(dá)到5M或更大。數(shù)據(jù)有效期不同潭陪，sessionStorage：僅在當(dāng)前瀏覽器窗口關(guān)閉前有效雄妥，自然也就不可能持久保持；localStorage：始終有效依溯，窗口或?yàn)g覽器關(guān)閉也一直保存老厌，因此用作持久數(shù)據(jù)；作用域不同黎炉，sessionStorage不在不同的瀏覽器窗口中共享枝秤，即使是同一個(gè)頁(yè)面；localStorage 在所有同源窗口中都是共享的慷嗜；Web Storage 支持事件通知機(jī)制淀弹，可以將數(shù)據(jù)更新的通知發(fā)送給監(jiān)聽者丹壕。
localStorage.clear() 刪除 localStorage 存儲(chǔ)的數(shù)據(jù)
localStorage.removeItem("a") 刪除某個(gè)鍵值
