HTML&CSS
1.請描述一下 cookies桐智，sessionStorage 和 localStorage 的區(qū)別末早？
cookie是網(wǎng)站為了標(biāo)示用戶身份而儲存在用戶本地終端（Client Side）上的數(shù)據(jù)（通常經(jīng)過加密）。
cookie數(shù)據(jù)始終在同源的http請求中攜帶（即使不需要）说庭，記會在瀏覽器和服務(wù)器間來回傳遞然磷。
sessionStorage和localStorage不會自動把數(shù)據(jù)發(fā)給服務(wù)器，僅在本地保存刊驴。
存儲大凶怂选：
cookie數(shù)據(jù)大小不能超過4k寡润。
sessionStorage和localStorage 雖然也有存儲大小的限制，但比cookie大得多舅柜，可以達(dá)到5M或更大梭纹。
有期時間：
localStorage? ? 存儲持久數(shù)據(jù)，瀏覽器關(guān)閉后數(shù)據(jù)不丟失除非主動刪除數(shù)據(jù)业踢；
sessionStorage??數(shù)據(jù)在當(dāng)前瀏覽器窗口關(guān)閉后自動刪除栗柒。
cookie? ?? ?? ? 設(shè)置的cookie過期時間之前一直有效，即使窗口或瀏覽器關(guān)閉
2.iframe有那些缺點知举？
iframe會阻塞主頁面的Onload事件瞬沦；
搜索引擎的檢索程序無法解讀這種頁面，不利于SEO;
iframe和主頁面共享連接池雇锡，而瀏覽器對相同域的連接有限制逛钻，所以會影響頁面的并行加載。
使用iframe之前需要考慮這兩個缺點锰提。如果需要使用iframe曙痘，最好是通過javascript動態(tài)給iframe添加src屬性值，這樣可以繞開以上兩個問題立肘。
3.如何實現(xiàn)瀏覽器內(nèi)多個標(biāo)簽頁之間的通信?
WebSocket边坤、SharedWorker
也可以調(diào)用localstorge、cookies等本地存儲方式谅年。
localstorge另一個瀏覽上下文里被添加茧痒、修改或刪除時，它都會觸發(fā)一個事件融蹂，我們通過監(jiān)聽事件旺订，控制它的值來進(jìn)行頁面信息通信。
注意quirks：Safari 在無痕模式下設(shè)置localstorge值時會拋出 QuotaExceededError 的異常超燃。
4.如何在頁面上實現(xiàn)一個圓形的可點擊區(qū)域区拳？
（1）map+area或者svg
（2）border-radius
（3）純js實現(xiàn) 需要求一個點在不在圓上簡單算法、獲取鼠標(biāo)坐標(biāo)等等
5.介紹一下標(biāo)準(zhǔn)的CSS的盒子模型意乓？低版本IE的盒子模型有什么不同的樱调？
（1）有兩種， IE 盒子模型届良、W3C 盒子模型笆凌。
（2）盒模型： 內(nèi)容(content)、填充(padding)伙窃、邊界(margin)菩颖、 邊框(border)。
（3）區(qū)??別： IE的content部分把 border 和 padding計算了進(jìn)去为障。
6.CSS優(yōu)先級算法如何計算晦闰？
優(yōu)先級就近原則放祟，同權(quán)重情況下樣式定義最近者為準(zhǔn);
載入樣式以最后載入的定位為準(zhǔn);
優(yōu)先級為:
!important >??id > class > tag
important比內(nèi)聯(lián)優(yōu)先級高(style)
7.為什么要使用CSS sprites
CSS Sprites其實就是把網(wǎng)頁中一些背景圖片整合到一張圖片文件中，再利用CSS的“background-image”呻右，“background-position”的組合進(jìn)行背景定位跪妥，這樣可以減少很多圖片請求的開銷，因為請求耗時比較長声滥；請求雖然可以并發(fā)眉撵，但是如果請求太多會給服務(wù)器增加很大的壓力。
8.display:none和visibility:hidden的區(qū)別落塑？
display:none??隱藏對應(yīng)的元素纽疟，在文檔布局中不再給它分配空間，它各邊的元素會合攏憾赁，就當(dāng)他從來不存在污朽。
visibility:hidden??隱藏對應(yīng)的元素，但是在文檔布局中仍保留原來的空間龙考。
9.position的absolute與fixed區(qū)別
absolute浮動定位是相對于父級中設(shè)置position為relative或者absolute最近的父級元素
fixed浮動定位是相對于瀏覽器視窗的
10.IE 8以下版本的瀏覽器中的盒模型有什么不同蟆肆？
IE8以下瀏覽器的盒模型中定義的元素的寬高不包括內(nèi)邊距和邊框
JavaScript
1.JS數(shù)組去重
以下是展示三種方法：
javascript 代碼
Array.prototype.unique1=function(){
varn=[];//一個新的臨時數(shù)組
for(vari=0;i
{
//如果當(dāng)前數(shù)組的第i已經(jīng)保存進(jìn)了臨時數(shù)組，那么跳過晦款，
//否則把當(dāng)前項push到臨時數(shù)組里面
if(n.indexOf(this[i])==-1)n.push(this[i]);
}
returnn;
}
Array.prototype.unique2=function()
{
varn={},r=[];//n為hash表炎功，r為臨時數(shù)組
for(vari=0;i
{
if(!n[this[i]])//如果hash表中沒有當(dāng)前項
{
n[this[i]]=true;//存入hash表
r.push(this[i]);//把當(dāng)前數(shù)組的當(dāng)前項push到臨時數(shù)組里面
}
}
returnr;
}
Array.prototype.unique3=function()
{
varn=[this[0]];//結(jié)果數(shù)組
for(vari=1;i
{
//如果當(dāng)前數(shù)組的第i項在當(dāng)前數(shù)組中第一次出現(xiàn)的位置不是i，
//那么表示第i項是重復(fù)的缓溅，忽略掉蛇损。否則存入結(jié)果數(shù)組
if(this.indexOf(this[i])==i)n.push(this[i]);
2.js操作獲取和設(shè)置cookie
//創(chuàng)建cookie
functionsetCookie(name,value,expires,path,domain,secure){
varcookieText=encodeURIComponent(name)+'='+encodeURIComponent(value);
if(expiresinstanceofDate){
cookieText+=';?expires='+expires;
}
if(path){
cookieText+=';?expires='+expires;
}
if(domain){
cookieText+=';?domain='+domain;
}
if(secure){
cookieText+=';?secure';
}
document.cookie=cookieText;
}
//獲取cookie
functiongetCookie(name){
varcookieName=encodeURIComponent(name)+'=';
varcookieStart=document.cookie.indexOf(cookieName);
varcookieValue=null;
if(cookieStart>-1){
varcookieEnd=document.cookie.indexOf(';',cookieStart);
if(cookieEnd==-1){
cookieEnd=document.cookie.length;
}
cookieValue=decodeURIComponent(document.cookie.substring(cookieStart+cookieName.length,cookieEnd));
}
returncookieValue;
}
3.ajax 有那些優(yōu)缺點?如何解決跨域問題?
（Q1）
優(yōu)點：
（1）通過異步模式，提升了用戶體驗.
（2）優(yōu)化了瀏覽器和服務(wù)器之間的傳輸肛宋，減少不必要的數(shù)據(jù)往返州藕，減少了帶寬占用.
（3）Ajax在客戶端運行束世，承擔(dān)了一部分本來由服務(wù)器承擔(dān)的工作酝陈，減少了大用戶量下的服務(wù)器負(fù)載。
（4）Ajax可以實現(xiàn)動態(tài)不刷新（局部刷新）
缺點：
（1）安全問題 AJAX暴露了與服務(wù)器交互的細(xì)節(jié)毁涉。
（2）對搜索引擎的支持比較弱沉帮。
（3）不容易調(diào)試。
（Q2）jsonp贫堰、 iframe穆壕、window.name、window.postMessage其屏、服務(wù)器上設(shè)置代理頁面喇勋。
4.JavaScript原型，原型鏈 ? 有什么特點偎行？
（1）原型對象也是普通的對象川背，是對象一個自帶隱式的 __proto__ 屬性贰拿，原型也有可能有自己的原型，如果一個原型對象的原型不為null的話熄云，我們就稱之為原型鏈膨更。
（2）原型鏈?zhǔn)怯梢恍┯脕砝^承和共享屬性的對象組成的（有限的）對象鏈。
5.GET和POST的區(qū)別缴允，何時使用POST荚守？
GET：一般用于信息獲取，使用URL傳遞參數(shù)练般，對所發(fā)送信息的數(shù)量也有限制矗漾，一般在2000個字符
POST：一般用于修改服務(wù)器上的資源，對所發(fā)送的信息沒有限制薄料。
GET方式需要使用Request.QueryString來取得變量的值缩功，而POST方式通過Request.Form來獲取變量的值，
也就是說Get是通過地址欄來傳值都办，而Post是通過提交表單來傳值嫡锌。
然而，在以下情況中琳钉，請使用 POST 請求：
無法使用緩存文件（更新服務(wù)器上的文件或數(shù)據(jù)庫）
向服務(wù)器發(fā)送大量數(shù)據(jù)（POST 沒有數(shù)據(jù)量限制）
發(fā)送包含未知字符的用戶輸入時势木，POST 比 GET 更穩(wěn)定也更可靠
6.請解釋一下 JavaScript 的同源策略
概念:同源策略是客戶端腳本（尤其是Javascript）的重要的安全度量標(biāo)準(zhǔn)。它最早出自Netscape Navigator2.0歌懒，其目的是防止某個文檔或腳本從多個不同源裝載啦桌。
這里的同源策略指的是：協(xié)議，域名及皂，端口相同甫男，同源策略是一種安全協(xié)議。
指一段腳本只能讀取來自同一來源的窗口和文檔的屬性验烧。
為什么要有同源限制板驳？
我們舉例說明：比如一個黑客程序，他利用Iframe把真正的銀行登錄頁面嵌到他的頁面上碍拆，當(dāng)你使用真實的用戶名若治，密碼登錄時，他的頁面就可以通過Javascript讀取到你的表單中input中的內(nèi)容感混，這樣用戶名端幼，密碼就輕松到手了。
7.Flash弧满、Ajax各自的優(yōu)缺點婆跑，在使用中如何取舍？
Flash適合處理多媒體庭呜、矢量圖形滑进、訪問機(jī)器摹迷；對CSS、處理文本上不足郊供，不容易被搜索峡碉。
Ajax對CSS、文本支持很好驮审，支持搜索鲫寄；多媒體、矢量圖形疯淫、機(jī)器訪問不足地来。
共同點：與服務(wù)器的無刷新傳遞消息、用戶離線和在線狀態(tài)熙掺、操作DOM
8.什么是閉包未斑？
閉包，官方對閉包的解釋是：一個擁有許多變量和綁定了這些變量的環(huán)境的表達(dá)式（通常是一個函數(shù)）币绩，因而這些變量也是該表達(dá)式的一部分蜡秽。閉包的特點：
（1）作為一個函數(shù)變量的一個引用，當(dāng)函數(shù)返回時缆镣，其處于激活狀態(tài)芽突。
（2） 一個閉包就是當(dāng)一個函數(shù)返回時，一個沒有釋放資源的棧區(qū)董瞻。
簡單的說寞蚌，Javascript允許使用內(nèi)部函數(shù)---即函數(shù)定義和函數(shù)表達(dá)式位于另一個函數(shù)的函數(shù)體內(nèi)。而且钠糊，這些內(nèi)部函數(shù)可以訪問它們所在的外部函數(shù)中聲明的所有局部變量挟秤、參數(shù)和聲明的其他內(nèi)部函數(shù)。當(dāng)其中一個這樣的內(nèi)部函數(shù)在包含它們的外部函數(shù)之外被調(diào)用時抄伍，就會形成閉包艘刚。
9.javascript里面的繼承怎么實現(xiàn)，如何避免原型鏈上面的對象共享
用構(gòu)造函數(shù)和原型鏈的混合模式去實現(xiàn)繼承逝慧，避免對象共享可以參考經(jīng)典的extend()函數(shù)昔脯，很多前端框架都有封裝的啄糙，就是用一個空函數(shù)當(dāng)做中間變量
10.ajax過程
(1)創(chuàng)建XMLHttpRequest對象,也就是創(chuàng)建一個異步調(diào)用對象.
(2)創(chuàng)建一個新的HTTP請求,并指定該HTTP請求的方法笛臣、URL及驗證信息.
(3)設(shè)置響應(yīng)HTTP請求狀態(tài)變化的函數(shù).
(4)發(fā)送HTTP請求.
(5)獲取異步調(diào)用返回的數(shù)據(jù).
(6)使用JavaScript和DOM實現(xiàn)局部刷新.
其他
1.一個頁面從輸入 URL 到頁面加載顯示完成，這個過程中都發(fā)生了什么隧饼？
（1）查找瀏覽器緩存
（2）DNS解析沈堡、查找該域名對應(yīng)的IP地址、重定向（301）燕雁、發(fā)出第二個GET請求
（3）進(jìn)行HTTP協(xié)議會話
（4）客戶端發(fā)送報頭(請求報頭)
（5）服務(wù)器回饋報頭(響應(yīng)報頭)
（6）html文檔開始下載
（7）文檔樹建立诞丽，根據(jù)標(biāo)記請求所需指定MIME類型的文件
（8）文件顯示
