1. HTML5是什么？有哪些新特性？有哪些新增標(biāo)簽？如何讓低版本的 IE 支持 HTML5新標(biāo)簽
HTML5：
是對(duì) HTML 標(biāo)準(zhǔn)的第五次修訂，目前仍未完工。其主要的目標(biāo)是將互聯(lián)網(wǎng)語(yǔ)義化，以便更好地被人類和機(jī)器閱讀，并同時(shí)提供更好地支持各種媒體的嵌入。HTML5 的語(yǔ)法是向后兼容的。
新特性:
- 語(yǔ)義化：它能讓你更恰當(dāng)?shù)拿枋瞿愕膬?nèi)容是什么。
- 連通性：能夠讓你和服務(wù)器之間通過(guò)創(chuàng)新的新技術(shù)進(jìn)行通信。
- 離線&儲(chǔ)存：能夠讓網(wǎng)頁(yè)在客戶端本地儲(chǔ)存數(shù)據(jù)以及更高的離線運(yùn)行。
- 多媒體：使video和audio成為了在所有web中的一等公民。
- 2D/3D繪圖&效果：提供了一個(gè)更加分化范圍的呈現(xiàn)選擇。
- 性能&集成：提供了非常顯著的性能優(yōu)化和更有效率的計(jì)算機(jī)硬件使用。
- 設(shè)備訪問(wèn)：能夠處理各種輸入和輸出設(shè)備。
- 樣式設(shè)計(jì)：能讓作者創(chuàng)造更復(fù)雜的主題
新增標(biāo)簽:
<header>、<main>,<footer>,<figure>,<nav>,<aside>,<svg>,<section>,<article>,<canvas>。都是塊級(jí)元素，主要體現(xiàn)了標(biāo)簽的語(yǔ)義化。
讓低版本的 IE 支持
方法一：
引入html5.js
<!--[if lt IE 9]>
<script src="http://cdn.bootcss.com/html5shiv/r29/html5.min.js"></script>
<![endif]-->
方法二:
自己添加一段js代碼
缺點(diǎn)：部分css無(wú)效
1.
<!--[if lt IE 9]>
<script>
(function(){
var html5 = ["header", "footer", "nav", "section", "article", "aside", "canvas", "audio", "video", "source", "embed", "track", "datalist", "keygen", "output", "bdi", "command", "details", "dialog", "summary", "figure", "figcaption", "mark", "meter", "progress", "ruby", "rt", "rp", "time", "wbr"];
for(var i = 0; i < html5.length; i++){
document.createElement(html5[i]);
}
})()
</script>
<![endif]-->
2.
<!--[if lt IE 9]>
<script>
createHtml5("header", "footer", "nav", "section", "article", "aside", "canvas", "audio", "video", "source", "embed", "track", "datalist", "keygen", "output", "bdi", "command", "details", "dialog", "summary", "figure", "figcaption", "mark", "meter", "progress", "ruby", "rt", "rp", "time", "wbr");
function createHtml5(){
var args = Array.prototype.slice.call(arguments, 0);
for(var i = 0; i < args.length; i++){
document.createElement(args[i]);
}
};
</script>
<![endif]-->
2.input 有哪些新增類型？
1.email
2.url
3.number
4.range
5.Date Picker
- Date
- month
- week
- time
- datatime
3.瀏覽器本地存儲(chǔ)中 cookie 和 localStorage 有什么區(qū)別？ localStorage 如何存儲(chǔ)刪除數(shù)據(jù)。
cookie是網(wǎng)站為了表示用戶身份而儲(chǔ)存在用戶本地終端（Client Side）上的數(shù)據(jù)（通常經(jīng)過(guò)加密）。cookie數(shù)據(jù)始終在同源的http請(qǐng)求中攜帶（即使不需要），即會(huì)在瀏覽器和服務(wù)器間來(lái)回傳遞。localStorage不會(huì)自動(dòng)把數(shù)據(jù)發(fā)給服務(wù)器，僅在本地保存。
存儲(chǔ)大小：
cookie數(shù)據(jù)大小不能超過(guò)4k。
localStorage 雖然也有存儲(chǔ)大小的限制，但比cookie大得多，可以達(dá)到5M或更大(跟瀏覽器相關(guān))。
有效時(shí)間：
cookie 設(shè)置的cookie在過(guò)期時(shí)間之前一直有效，即使窗口或?yàn)g覽器關(guān)閉。
localStorage 存儲(chǔ)持久數(shù)據(jù)，瀏覽器關(guān)閉后數(shù)據(jù)不丟失除非主動(dòng)刪除數(shù)據(jù)。
瀏覽器支持：
瀏覽器都支持cookie
IE9以上才支持localStorage
localStorage 如何存儲(chǔ)刪除數(shù)據(jù)：
存儲(chǔ)：localStorage.setItem("key", "value")
刪除：localStorage.removeItem("key")
讀取：localStorage.getItem("key")
清除：localStorage.clear()
4.寫(xiě)出如下 CSS3效果的簡(jiǎn)單事例
1. 圓角， 圓形
2. div 陰影
3. 2D 轉(zhuǎn)換：放大、縮小、偏移、旋轉(zhuǎn)
4. 3D 轉(zhuǎn)換：移動(dòng)、旋轉(zhuǎn)
5. 背景色漸變
6. 過(guò)渡效果
7. 動(dòng)畫(huà)
