HTML部分
1.描述一下 cookies，sessionStorage 和 localStorage 的區別
| 項目 | cookies | sessionStorage | localStorage |
|---|---|---|---|
| 存儲大小 | 不能超過4k | 可以大於5M | 可以大於5M |
| 有效時間 | 設置的cookie過期時間之前一直有效 | 數據在當前瀏覽器窗口關閉後自動刪除 | 瀏覽器關閉後數據不丟失除非主動刪除數據 |
| 是否發送服務器 | 網站爲了標示用戶身份而儲存在用戶本地終端（Client Side）上的數據（通常經過加密）,始終在同源的http請求中攜帶（即使不需要），記會在瀏覽器和服務器間來回傳遞 | 不會自動把數據發給服務器，僅在本地保存 | 不會自動把數據發給服務器，僅在本地保存 |
2.iframe有那些缺點?
1) 阻塞主頁面的Onload事件
2) 搜索引擎的檢索程序無法解讀這種頁面，不利於SEO
3) iframe和主頁面共享連接池，而瀏覽器對相同域的連接有限制，所以會影響頁面的並行加載
解決方法：通過javascript動態給iframe添加src屬性值
3.Label的作用是什麼？是怎麼用的?
作用：label標籤來定義表單控制間的關係,當用戶選擇該標籤時，瀏覽器會自動將焦點轉到和標籤相關的表單控件上
用法：
<label for="Name">Number:</label>
<input type=“text“name="Name" id="Name"/>
<label>Date:<input type="text" name="B"/></label>4.HTML5的form如何關閉自動完成功能?
給不想要提示的 form 或某個 input 設置爲 autocomplete=off
5.如何實現瀏覽器內多個標籤頁之間的通信?
1）WebSocket、SharedWorker；
2）調用localstorge、cookies等本地存儲方式；
3）localstorge另一個瀏覽上下文裏被添加、修改或刪除時，它都會觸發一個事件，我們通過監聽事件，控制它的值來進行頁面信息通信；
注意quirks：Safari 在無痕模式下設置localstorge值時會拋出 QuotaExceededError 的異常；
6.webSocket如何兼容低瀏覽器？
1） Adobe Flash Socket 、
2）ActiveX HTMLFile (IE) 、
3）基於 multipart 編碼發送 XHR 、
4）基於長輪詢的 XHR
7.頁面可見性（Page Visibility API） 可以有哪些用途？
1）通過 visibilityState 的值檢測頁面當前是否可見，以及打開網頁的時間等;
2）在頁面被切換到其他後臺進程的時候，自動暫停音樂或視頻的播放；
8.如何在頁面上實現一個圓形的可點擊區域？
1）map+area或者svg
2）border-radius
3）純js實現 需要求一個點在不在圓上簡單算法、獲取鼠標座標等等
9.實現不使用 border 畫出1px高的線，在不同瀏覽器的標準模式與怪異模式下都能保持一致的效果
<div style="height:1px;overflow:hidden;background:red"></div>10.網頁驗證碼是幹嘛的，是爲了解決什麼安全問題？
1）區分用戶是計算機還是人的公共全自動程序。可以防止惡意破解密碼、刷票、論壇灌水；
2）有效防止黑客對某一個特定註冊用戶用特定程序暴力破解方式進行不斷的登陸嘗試。
11.title與h1的區別、b與strong的區別、i與em的區別？
1）title屬性沒有明確意義只表示是個標題，H1則表示層次明確的標題，對頁面信息的抓取也有很大的影響；
2）strong是標明重點內容，有語氣加強的含義，使用閱讀設備閱讀網絡時：會重讀，而是展示強調內容
3）i內容展示爲斜體，em表示強調的文本；
Physical Style Elements – 自然樣式標籤
b, i, u, s, pre
Semantic Style Elements – 語義樣式標籤
strong, em, ins, del, code
應該準確使用語義樣式標籤, 但不能濫用, 如果不能確定時首選使用自然樣式標籤。