HTML

1.對(duì)WEB標(biāo)準(zhǔn)以及W3C的理解與認(rèn)識(shí)

標(biāo)簽閉合、標(biāo)簽小寫、不亂嵌套、提高搜索機(jī)器人搜索幾率、使用外 鏈css和js腳本、結(jié)構(gòu)行為表現(xiàn)的分離、文件下載與頁(yè)面速度更快、內(nèi)容能被更多的用戶所訪問(wèn)、內(nèi)容能被更廣泛的設(shè)備所訪問(wèn)、更少的代碼和組件，容易維 護(hù)、改版方便，不需要變動(dòng)頁(yè)面內(nèi)容、提供打印版本而不需要復(fù)制內(nèi)容、提高網(wǎng)站易用性；

2.xhtml和html有什么區(qū)別

HTML是一種基本的WEB網(wǎng)頁(yè)設(shè)計(jì)語(yǔ)言，XHTML是一個(gè)基于XML的置標(biāo)語(yǔ)言

最主要的不同：

XHTML 元素必須被正確地嵌套。

XHTML 元素必須被關(guān)閉。

標(biāo)簽名必須用小寫字母。

XHTML 文檔必須擁有根元素。

3.Doctype? 嚴(yán)格模式與混雜模式-如何觸發(fā)這兩種模式，區(qū)分它們有何意義?

用于聲明文檔使用那種規(guī)范（html/Xhtml）一般為 嚴(yán)格 過(guò)度 基于框架的html文檔

加入XMl聲明可觸發(fā)，解析方式更改為IE5.5 擁有IE5.5的bug

4.行內(nèi)元素有哪些?塊級(jí)元素有哪些?

塊級(jí)元素：div p h1 h2 h3 h4 form ul

行內(nèi)元素: a b br i span input select

5.HTML全局屬性(global attribute)有哪些

參考資料：MDN: html global attribute或者W3C HTML global-attributes

accesskey

:設(shè)置快捷鍵，提供快速訪問(wèn)元素如aaa在windows下的firefox中按alt + shift + a

可激活元素

class

:為元素設(shè)置類標(biāo)識(shí)，多個(gè)類名用空格分開，CSS和javascript可通過(guò)class屬性獲取元素

contenteditable

: 指定元素內(nèi)容是否可編輯

contextmenu

: 自定義鼠標(biāo)右鍵彈出菜單內(nèi)容

data-*

: 為元素增加自定義屬性

dir

: 設(shè)置元素文本方向

draggable

: 設(shè)置元素是否可拖拽

dropzone

: 設(shè)置元素拖放類型： copy, move, link

hidden

: 表示一個(gè)元素是否與文檔。樣式上會(huì)導(dǎo)致元素不顯示，但是不能用這個(gè)屬性實(shí)現(xiàn)樣式效果

id

: 元素id，文檔內(nèi)唯一

lang

: 元素內(nèi)容的的語(yǔ)言

spellcheck

: 是否啟動(dòng)拼寫和語(yǔ)法檢查

style

: 行內(nèi)css樣式

tabindex

: 設(shè)置元素可以獲得焦點(diǎn)，通過(guò)tab可以導(dǎo)航

title

: 元素相關(guān)的建議信息

translate

: 元素和子孫節(jié)點(diǎn)內(nèi)容是否需要本地化

6.什么是web語(yǔ)義化,有什么好處

web語(yǔ)義化是指通過(guò)HTML標(biāo)記表示頁(yè)面包含的信息，包含了HTML標(biāo)簽的語(yǔ)義化和css命名的語(yǔ)義化。 HTML標(biāo)簽的語(yǔ)義化是指：通過(guò)使用包含語(yǔ)義的標(biāo)簽（如h1-h6）恰當(dāng)?shù)乇硎疚臋n結(jié)構(gòu) css命名的語(yǔ)義化是指：為html標(biāo)簽添加有意義的class，id補(bǔ)充未表達(dá)的語(yǔ)義，如Microformat通過(guò)添加符合規(guī)則的class描述信息 為什么需要語(yǔ)義化：

去掉樣式后頁(yè)面呈現(xiàn)清晰的結(jié)構(gòu)

盲人使用讀屏器更好地閱讀

搜索引擎更好地理解頁(yè)面，有利于收錄

便團(tuán)隊(duì)項(xiàng)目的可持續(xù)運(yùn)作及維護(hù)

7.html5有哪些新特性、移除了那些元素？如何處理HTML5新標(biāo)簽的瀏覽器兼容問(wèn)題？如何區(qū)分 HTML 和 HTML5？

新特性：

HTML5 現(xiàn)在已經(jīng)不是 SGML 的子集，主要是關(guān)于圖像，位置，存儲(chǔ)，多任務(wù)等功能的增加。

拖拽釋放(Drag and drop) API

語(yǔ)義化更好的內(nèi)容標(biāo)簽（header,nav,footer,aside,article,section）

音頻、視頻API(audio,video)

畫布(Canvas) API

地理(Geolocation) API

本地離線存儲(chǔ) localStorage 長(zhǎng)期存儲(chǔ)數(shù)據(jù)，瀏覽器關(guān)閉后數(shù)據(jù)不丟失；

sessionStorage 的數(shù)據(jù)在瀏覽器關(guān)閉后自動(dòng)刪除

表單控件，calendar、date、time、email、url、search

新的技術(shù)webworker, websocket, Geolocation

移除的元素：

純表現(xiàn)的元素：basefont，big，center，font, s，strike，tt，u；

對(duì)可用性產(chǎn)生負(fù)面影響的元素：frame，frameset，noframes；

支持HTML5新標(biāo)簽：

IE8/IE7/IE6支持通過(guò) document.createElement 方法產(chǎn)生的標(biāo)簽，可以利用這一特性讓這些瀏覽器支持 HTML5 新標(biāo)簽，瀏覽器支持新標(biāo)簽后，還需要添加標(biāo)簽?zāi)J(rèn)的樣式（當(dāng)然最好的方式是直接使用成熟的框架、使用最多的是html5shiv框架）：

如何區(qū)分：

DOCTYPE聲明新增的結(jié)構(gòu)元素、功能元素

8. HTML5 存儲(chǔ)類型有什么區(qū)別？

HTML5 能夠本地存儲(chǔ)數(shù)據(jù)，在之前都是使用 cookies 使用的。HTML5 提供了下面兩種本地存儲(chǔ)方案：

localStorage - 沒(méi)有時(shí)間限制的數(shù)據(jù)存儲(chǔ)，數(shù)據(jù)永遠(yuǎn)不會(huì)過(guò)期，關(guān)閉瀏覽器也不會(huì)丟失

sessionStorage - 針對(duì)一個(gè) session 的數(shù)據(jù)存儲(chǔ)，同一個(gè)會(huì)話中的頁(yè)面才能訪問(wèn)并且當(dāng)會(huì)話結(jié)束后數(shù)據(jù)也隨之銷毀。

9. HTML5 標(biāo)準(zhǔn)提供了哪些新的API？

1：canvas，不用多說(shuō)，可以畫出很多絢麗的圖形，甚至可以直接做出偽3D游戲。

2：媒體控制，也很好理解(直譯就是回放功能，假如只用html5.0以下的標(biāo)簽寫，以前的音樂(lè)播放是不可能實(shí)現(xiàn)滾動(dòng)條的。)

3：離線網(wǎng)頁(yè)程序，可以把資源文件完全緩存在客戶端，并且通過(guò)js的一些方法清空緩存

4：文檔編輯，應(yīng)該是更好的支持對(duì)文檔的編輯。

5：拖動(dòng)，可以將文件拖動(dòng)到某些區(qū)域上傳

6：跨文檔請(qǐng)求，websocket，一種更加高效的通訊方式

7：歷史管理，可以通過(guò)js管理和插入歷史記錄

8：MIME頭自定義

9：客戶端數(shù)據(jù)存儲(chǔ)，localstoage sessionstoage

10：地理位置共享

11：本地?cái)?shù)據(jù)庫(kù)

12：索引數(shù)據(jù)庫(kù)

10.HTML5 應(yīng)用程序緩存和瀏覽器緩存有什么區(qū)別？

HTML5 引入了應(yīng)用程序緩存，這意味著 web 應(yīng)用可進(jìn)行緩存，并可在沒(méi)有因特網(wǎng)連接時(shí)進(jìn)行訪問(wèn)。

應(yīng)用程序緩存為應(yīng)用帶來(lái)三個(gè)優(yōu)勢(shì)：

離線瀏覽 - 用戶可在應(yīng)用離線時(shí)使用它們

速度 - 已緩存資源加載得更快

減少服務(wù)器負(fù)載 - 瀏覽器將只從服務(wù)器下載更新過(guò)或更改過(guò)的資源。

11.常用那幾種瀏覽器測(cè)試？有哪些內(nèi)核(Layout Engine)?

(Q1)瀏覽器：IE，Chrome，F(xiàn)ireFox，Safari，Opera。

(Q2)內(nèi)核：Trident，Gecko，Presto，Webkit。

12.請(qǐng)描述一下 cookies，sessionStorage 和 localStorage 的區(qū)別？

cookie在瀏覽器和服務(wù)器間來(lái)回傳遞。 sessionStorage和localStorage不會(huì)

sessionStorage和localStorage的存儲(chǔ)空間更大；

sessionStorage和localStorage有更多豐富易用的接口；

sessionStorage和localStorage各自獨(dú)立的存儲(chǔ)空間；

13.如何實(shí)現(xiàn)瀏覽器內(nèi)多個(gè)標(biāo)簽頁(yè)之間的通信?

調(diào)用localstorge、cookies等本地存儲(chǔ)方式

14.請(qǐng)寫出localStorage對(duì)象的常用方法。

存儲(chǔ) - localStorage.setItem(key, value) - 如果key存在，更新value

獲取 - localStorage.getItem(key) - 如果key不存在，返回null

刪除 - localStorage.removeItem(key) - 刪除key對(duì)應(yīng)的數(shù)據(jù)

全部清除 - localStorage.clear() - 清空l(shuí)ocalStorage中所有數(shù)據(jù)

遍歷 - localStorage.length

遍歷 - localStorage.key(index)

15.如何在HTML5中啟用應(yīng)用程序緩存？

每個(gè)指定了manifest的頁(yè)面在用戶對(duì)其訪問(wèn)時(shí)都會(huì)被緩存。

.appcache是manifest文件的擴(kuò)展名

16.html5 離線存儲(chǔ)

Html5的一個(gè)重要特性就是離線存儲(chǔ)，所謂的離線存儲(chǔ)就是將一些資源文件保存在本地，這樣后續(xù)的頁(yè)面重新加載將使用本地資源文件，在離線情況下可以繼續(xù)訪問(wèn)web應(yīng)用，同時(shí)通過(guò)一定的手法（更新相關(guān)文件或者使用相關(guān)API），可以更新、刪除離線存儲(chǔ)等操作。

Html5的離線存儲(chǔ)使用一個(gè)manifest文件來(lái)標(biāo)明哪些文件是需要被存儲(chǔ)的，使用如 來(lái)引入一個(gè)manifest文件，這個(gè)文件的路徑可以是相對(duì)的，也可以是絕對(duì)的，如果你的web應(yīng)用很多，而且希望能集中管理manifest文件，那么靜態(tài)文件服務(wù)器是個(gè)不錯(cuò)的選擇。

17.HTML5 Canvas 元素有什么用？

Canvas 元素用于在網(wǎng)頁(yè)上繪制圖形，該元素標(biāo)簽強(qiáng)大之處在于可以直接在 HTML 上進(jìn)行圖形操作

前端學(xué)習(xí)群：543761540 點(diǎn)擊鏈接加入群【前端交流總?cè)孩邸浚篽ttps://jq.qq.com/?_wv=1027&k=47dJVMq