一、Doctype作用？嚴格模式與混雜模式如何區分？它們有何意義?
1.聲明位于文檔中的最前面的位置，處于標簽之前。此標簽可告知瀏覽器文檔使用哪種HTML或XHTML規范。
2.所謂的標準模式是指，瀏覽器按W3C標準解析執行代碼；怪異模式則是使用瀏覽器自己的方式解析執行代碼，因為不同瀏覽器解析執行的方式不一樣，所以我們稱之為怪異模式。
3.瀏覽器解析時到底使用標準模式還是怪異模式，與你網頁中的DTD聲明直接相關，DTD聲明定義了標準文檔的類型（標準模式解析）文檔類型，會使瀏覽器使用相應的方式加載網頁并顯示，忽略DTD聲明,將使網頁進入怪異模式。
二、HTML5 為什么只需要寫 doctype？
HTML 4.01中的doctype需要對DTD進行引用，因為HTML 4.01基于SGML。
而HTML 5不基于SGML，因此不需要對DTD進行引用，但是需要doctype來規范瀏覽器的行為。
其中，SGML是標準通用標記語言,簡單的說，就是比HTML,XML更老的標準，這兩者都是由SGML發展而來的。
BUT，HTML5不是的。
三、行內元素有哪些？塊級元素有哪些？空(void)元素有那些？
行內元素：a、b、span、img、input、strong、select、label、em、button、textarea
塊級元素：div、ul、li、dl、dt、dd、p、h1-h6、blockquote
空元素：即系沒有內容的HTML元素，例如：br、meta、hr、link、input、img
四、頁面導入樣式時，使用link和@import有什么區別？
兩者都是外部引用CSS的方式，但是存在一定的區別：
區別1：link是XHTML標簽，除了加載CSS外，還可以定義RSS等其他事務；@import屬于CSS范疇，只能加載CSS。
區別2：link引用CSS時，在頁面載入時同時加載；@import需要頁面網頁完全載入以后加載。
區別3：link是XHTML標簽，無兼容問題；@import是在CSS2.1提出的，低版本的瀏覽器不支持。
區別4：ink支持使用Javascript控制DOM去改變樣式；而@import不支持。
五、介紹一下你對瀏覽器內核的理解？
瀏覽器最重要或者說核心的部分是“Rendering Engine”，可大概譯為“渲染引擎”，不過我們一般習慣將之稱為“瀏覽器內核”。負責對網頁語法的解釋(如標準通用標記語言下的一個應用HTML、JavaScript)并渲染(顯示)網頁。 所以，通常所謂的瀏覽器內核也就是瀏覽器所采用的渲染引擎，渲染引擎決定了瀏覽器如何顯示網頁的內容以及頁面的格式信息。不同的瀏覽器內核對網頁編寫語法的解釋也有不同，因此同一網頁在不同的內核的瀏覽器里的渲染(顯示)效果也可能不同，這也是網頁編寫者需要在不同內核的瀏覽器中測試網頁顯示效果的原因。
主要分成兩部分：渲染引擎(layout engineer或Rendering Engine)和JS引擎。
渲染引擎：負責取得網頁的內容(HTML、XML、圖像等等)、整理訊息(例如加入CSS等)，以及計算網頁的顯示方式，后會輸出至顯示器或打印機。瀏覽器的內核的不同對于網頁的語法解釋會有不同，所以渲染的效果也不相同。所有網頁瀏覽器、電子郵件客戶端以及其它需要編輯、顯示網絡內容的應用程序都需要內核。
JS引擎則：解析和執行javascript來實現網頁的動態效果。
最開始渲染引擎和JS引擎并沒有區分的很明確，后來JS引擎越來越獨立，內核就傾向于只指渲染引擎。
六、常見的瀏覽器內核有哪些？
Trident內核：IE,MaxThon,TT,The World,360,搜狗瀏覽器等。[又稱MSHTML]
Gecko內核：Netscape6及以上版本，FF,MozillaSuite/SeaMonkey等
Presto內核：Opera7及以上。[Opera內核原為：Presto，現為：Blink;]
Webkit內核：Safari,Chrome等。[ Chrome的：Blink（WebKit的分支）]
七、html5有哪些新特性、移除了那些元素？如何處理HTML5新標簽的瀏覽器兼容問題？如何區分 HTML 和 HTML5？
新增的元素有繪畫canvas ，用于媒介回放的 video 和 audio 元素，本地離線存儲 localStorage 長期存儲數據，瀏覽器關閉后數據不丟失，而sessionStorage的數據在瀏覽器關閉后自動刪除，此外，還新增了以下的幾大類元素。
內容元素，article、footer、header、nav、section。
表單控件，calendar、date、time、email、url、search。
控件元素，webworker, websockt, Geolocation。
移出的元素有下列這些：
顯現層元素：basefont，big，center，font, s，strike，tt，u。
性能較差元素：frame，frameset，noframes。
如何處理HTML5新標簽的瀏覽器兼容問題？如何區分HTML和HTML5？
處理兼容問題有兩種方式：
1.IE8/IE7/IE6支持通過document.方法產生的標簽，利用這一特性讓這些瀏覽器支持HTML5新標簽。
2.使用是html5shim框架
另外，DOCTYPE聲明的方式是區分HTML和HTML5標志的一個重要因素，此外，還可以根據新增的結構、功能元素來加以區分。
八、簡述一下你對HTML語義化的理解？
用正確的標簽做正確的事情。
html語義化讓頁面的內容結構化，結構更清晰，便于對瀏覽器、搜索引擎解析;
即使在沒有樣式CSS情況下也以一種文檔格式顯示，并且是容易閱讀的;
搜索引擎的爬蟲也依賴于HTML標記來確定上下文和各個關鍵字的權重，利于SEO;
使閱讀源代碼的人對網站更容易將網站分塊，便于閱讀維護理解。
九、請描述一下 cookies，sessionStorage 和 localStorage 的區別？
共同點：都是保存在瀏覽器端，且同源的。
區別：cookie數據始終在同源的http請求中攜帶（即使不需要），即cookie在瀏覽器和服務器間來回傳遞。而sessionStorage和localStorage不會自動把數據發給服務器，僅在本地保存。cookie數據還有路徑（path）的概念，可以限制cookie只屬于某個路徑下。存儲大小限制也不同，cookie數據不能超過4k，同時因為每次http請求都會攜帶cookie，所以cookie只適合保存很小的數據，如會話標識。sessionStorage和localStorage 雖然也有存儲大小的限制，但比cookie大得多，可以達到5M或更大。數據有效期不同，sessionStorage：僅在當前瀏覽器窗口關閉前有效，自然也就不可能持久保持；localStorage：始終有效，窗口或瀏覽器關閉也一直保存，因此用作持久數據；cookie只在設置的cookie過期時間之前一直有效，即使窗口或瀏覽器關閉。作用域不同，sessionStorage不在不同的瀏覽器窗口中共享，即使是同一個頁面；localStorage 在所有同源窗口中都是共享的；cookie也是在所有同源窗口中都是共享的。Web Storage 支持事件通知機制，可以將數據更新的通知發送給監聽者。Web Storage 的 api 接口使用更方便。
十、HTML5的離線儲存怎么使用，工作原理能不能解釋一下？
原理：HTML5的離線存儲是基于一個新建的.appcache文件的，通過這個文件上的解析清單離線存儲資源，這些資源就會像cookie一樣被存儲了下來。之后當網絡在處于離線狀態下時，瀏覽器會通過被離線存儲的數據進行頁面展示。
十一、iframe有那些缺點？
1、在網頁中使用框架結構最大的弊病是搜索引擎的“蜘蛛”程序無法解讀這種頁面。當“蜘蛛”程序遇到由數個框架組成的網頁時，它們只看到框架而無法找到鏈接，因此它們會以為該網站是個死站點，并且很快轉身離去。對一個網站來說這無異于一場災難。
如果你想銷售產品，你需要客戶;如想得到客戶，你首先要讓人們訪問你的網站，而要做到這一點，你就非求助于搜索引擎不可。你花費了大量的時間、精力和金錢開設了一家網上商店，卻又故意不讓搜索引擎檢索你，這就好象開家零售商店，卻將窗戶全部漆成黑色，而且還不掛任何招牌一樣。
2、框架結構有時會讓人感到迷惑，特別是在幾個框架中都出現上下、左右滾動條的時候。這些滾動條除了會擠占已經非常有限的頁面空間外，還會分散訪問者的注意力。訪問者遇到這種網站往往會立刻轉身離開。他們會想，既然你的主頁如此混亂，那么網站的其他部分也許更不值得瀏覽。
3、鏈接導航問題。使用框架結構時，你必須保證正確設置所有的導航鏈接，如不然，會給訪問者帶來很大的麻煩。比如被鏈接的頁面出現在導航框架內，這種情況下訪問者便被陷住了，因為此時他沒有其他地方可去。
十二、Label的作用是什么？是怎么用的？（加 for 或 包裹）
Label 中有兩個屬性是非常有用的,一個是FOR、另外一個就是ACCESSKEY了。
FOR屬性
功能：表示Label標簽要綁定的HTML元素，你點擊這個標簽的時候，所綁定的元素將獲取焦點。
用法：<lable for="inputbox">姓名</lable><input type="text" id="inputbox">
ACCESSKEY屬性：
功能：表示訪問Label標簽所綁定的元素的熱鍵，當您按下熱鍵，所綁定的元素將獲取焦點。
用法：<lable for="inputbox" ACCESSKEY＝"N">姓名</lable><input type="text" ID="InputBox">
局限性：accessKey屬性所設置的快捷鍵不能與瀏覽器的快捷鍵沖突，否則將優先激活瀏覽器的快捷鍵。
注釋
要將 LABEL 綁定到其它的控件，請將 LABEL 元素的 FOR 屬性設置為與該控件的 ID 相同。將 LABEL 綁定到控件的 NAME 屬性毫無用處。但是，要提交表單，你必須為 LABEL 元素所綁定到的控件指定 NAME。
有兩種方法給所指定的快捷鍵添加下劃線。LABEL 元素的 rich text 支持可以在 ACCESSKEY 屬性所指定的快捷鍵字符兩側加上 U 元素。如果你更愿意使用樣式表(CSS)來應用樣式，可以將該字符包含在 SPAN 中，并設置樣式為“text-decoration: underline”。
如果用戶單擊 LABEL，則會先觸發 LABEL 上的 onclick 事件，然后觸發由 htmlFor 屬性所指定的控件上的 onclick 事件。按下 LABEL 設定的快捷鍵將設置焦點但并不觸發 onclick 事件。
標簽不允許嵌套。
此元素在 Internet Explorer 4.0 及以上版本的 HTML 和腳本中可用。
此元素是內嵌元素。
此元素需要關閉標簽。
十三、HTML5的form如何關閉自動完成功能？
1、在IE的Internet選項菜單里的內容--自動完成里面設置
2、設置Form的autocomplete為"on"或者"off"來開啟或者關閉自動完成功能
3、設置輸入框的autocomplete為"on"或者"off"來開啟或者關閉該輸入框的自動完成功能
十四、如何實現瀏覽器內多個標簽頁之間的通信? (阿里)
方法一：使用localStorage
使用localStorage.setItem(key,value);添加內容
使用storage事件監聽添加、修改、刪除的動作
window.addEventListener("storage",function(event){
? ? ? $("#name").val(event.key+”=”+event.newValue);
});
方法二、使用cookie+setInterval
<input id="name"><input type="button"id="btnOK"value="發送">
$(function(){
? ? $("#btnOK").click(function(){
? ? ? ? varname=$("#name").val();
? ? ? ? document.cookie="name="+name;
? ? });
});
//獲取Cookie天的內容
function getKey(key) {
? ? ? return JSON.parse("{\""+ document.cookie.replace(/;\s+/gim,"\",\"").replace(/=/gim,"\":\"") +"\"}")[key];
}
//每隔1秒獲取Cookie的內容
setInterval(function(){
? ? ? console.log(getKey("name"));
},1000);
