HTML5_CSS3

題目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文件來(lái)讓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 有哪些新增類(lèi)型?

  • email 輸入的郵箱要滿(mǎn)足郵箱地址的規(guī)范 @...
  • url 輸入的連接要滿(mǎn)足連接的規(guī)范 http://...
  • number 輸入的是數(shù)字才有效,輸入其他無(wú)效
  • range 變成一個(gè)百分比條
  • datepicker 直接日期選擇

題目3: 瀏覽器本地存儲(chǔ)中 cookie 和 localStorage 有什么區(qū)別? localStorage 如何存儲(chǔ)刪除數(shù)據(jù)。

  • localStorage帶來(lái)的好處:

    1. 減少網(wǎng)絡(luò)流量:一旦數(shù)據(jù)保存在本地后,就可以避免再向服務(wù)器請(qǐng)求數(shù)據(jù),因此減少不必要的數(shù)據(jù)請(qǐng)求,減少數(shù)據(jù)在瀏覽器和服務(wù)器間不必要地來(lái)回傳遞。
    2. 快速顯示數(shù)據(jù):性能好,從本地讀數(shù)據(jù)比通過(guò)網(wǎng)絡(luò)從服務(wù)器獲得數(shù)據(jù)快得多,本地?cái)?shù)據(jù)可以即時(shí)獲得。再加上網(wǎng)頁(yè)本身也可以有緩存,因此整個(gè)頁(yè)面和數(shù)據(jù)都在本地的話,可以立即顯示。
    3. 臨時(shí)存儲(chǔ):很多時(shí)候數(shù)據(jù)只需要在用戶(hù)瀏覽一組頁(yè)面期間使用,關(guān)閉窗口后數(shù)據(jù)就可以丟棄了,這種情況使用sessionStorage非常方便。
  • 共同點(diǎn):都是保存在瀏覽器端,且同源的。

  • 區(qū)別

    • cookie數(shù)據(jù)始終在同源的http請(qǐng)求中攜帶(即使不需要),即cookie在瀏覽器和服務(wù)器間來(lái)回傳遞。cookie數(shù)據(jù)還有路徑(path)的概念,可以限制cookie只屬于某個(gè)路徑下。存儲(chǔ)大小限制也不同,cookie數(shù)據(jù)不能超過(guò)4k,同時(shí)因?yàn)槊看蝖ttp請(qǐng)求都會(huì)攜帶cookie,所以cookie只適合保存很小的數(shù)據(jù),如會(huì)話標(biāo)識(shí)。cookie只在設(shè)置的cookie過(guò)期時(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)聽(tīng)者。
  • localStorage.clear() 刪除 localStorage 存儲(chǔ)的數(shù)據(jù)

  • localStorage.removeItem("a") 刪除某個(gè)鍵值

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 1.HTML5是什么?有哪些新特性?有哪些新增標(biāo)簽?如何讓低版本的IE支持HTML5新標(biāo)簽 HTML5是超文本標(biāo)記...
    BAWScipes閱讀 473評(píng)論 0 0
  • 題目1: HTML5是什么?有哪些新特性?有哪些新增標(biāo)簽?如何讓低版本的 IE 支持 HTML5新標(biāo)簽 HTML5...
    普萊那閱讀 496評(píng)論 0 0
  • 1. HTML5是什么?有哪些新特性?有哪些新增標(biāo)簽?如何讓低版本的 IE 支持 HTML5新標(biāo)簽 HTML5是超...
    _李祺閱讀 481評(píng)論 0 0
  • 我在寫(xiě)寫(xiě)方面我認(rèn)為是一只打不死的小強(qiáng)。 其實(shí),我知道,努力也是有方向的,找對(duì)方向,努力才不會(huì)白費(fèi),用對(duì)方法努力才能...
    碼字好玩兒閱讀 470評(píng)論 4 0
  • 就是那首長(zhǎng)亭外,古道邊的送別,想聽(tīng)的話,請(qǐng)點(diǎn)擊下方藍(lán)色歌名。 〔送別〕 口琴小吹28【陪你度過(guò)漫長(zhǎng)歲月】 口琴小吹...
    至簡(jiǎn)從心閱讀 908評(píng)論 22 34

友情鏈接更多精彩內(nèi)容