1，闡述清楚浮動(dòng)的幾種方式（常見(jiàn)問(wèn)題）
（1）父級(jí)div定義 height
原理：父級(jí)div手動(dòng)定義height，就解決了父級(jí)div無(wú)法自動(dòng)獲取到高度的問(wèn)題。 
優(yōu)點(diǎn)：簡(jiǎn)單、代碼少、容易掌握 
缺點(diǎn)：只適合高度固定的布局，要給出精確的高度，如果高度和父級(jí)div不一樣時(shí)，會(huì)產(chǎn)生問(wèn)題

（2）父級(jí)div定義 overflow:hidden
原理：必須定義width或zoom:1，同時(shí)不能定義height，使用overflow:hidden時(shí)，瀏覽器會(huì)自動(dòng)檢查浮動(dòng)區(qū)域的高度 
優(yōu)點(diǎn)：簡(jiǎn)單、代碼少、瀏覽器支持好

（3） 結(jié)尾處加空div標(biāo)簽 clear:both
原理：添加一個(gè)空div，利用css提高的clear:both清除浮動(dòng)，讓父級(jí)div能自動(dòng)獲取到高度 
優(yōu)點(diǎn)：簡(jiǎn)單、代碼少、瀏覽器支持好、不容易出現(xiàn)怪問(wèn)題
缺點(diǎn)：不少初學(xué)者不理解原理；如果頁(yè)面浮動(dòng)布局多，就要增加很多空div，讓人感覺(jué)很不好

2，解釋css sprites ，如何使用？
CSS Sprites其實(shí)就是把網(wǎng)頁(yè)中一些背景圖片整合到一張圖片文件中，再利用CSS的“background-image”，“background- repeat”，“background-position”的組合進(jìn)行背景定位，background-position可以用數(shù)字能精確的定位出背景圖片的位置。
CSS Sprites為一些大型的網(wǎng)站節(jié)約了帶寬，讓提高了用戶的加載速度和用戶體驗(yàn)，不需要加載更多的圖片

3，如何用原生js給一個(gè)按鈕綁定兩個(gè)onclick事件？
 

//事件監(jiān)聽(tīng) 綁定多個(gè)事件
var btn = document.getElementById("btn");
btn.addEventListener("click",hello1);
btn.addEventListener("click",hello2);
function hello1(){
 alert("hello 1");
}
function hello2(){
 alert("hello 2");
}

4，拖拽會(huì)用到哪些事件
· dragstart:拖拽開(kāi)始時(shí)在被拖拽元素上觸發(fā)此事件,監(jiān)聽(tīng)器需要設(shè)置拖拽所需數(shù)據(jù),從操作系統(tǒng)拖拽文件到瀏覽器時(shí)不觸發(fā)此事件.
· dragenter:拖拽鼠標(biāo)進(jìn)入元素時(shí)在該元素上觸發(fā),用于給拖放元素設(shè)置視覺(jué)反饋,如高亮
· dragover:拖拽時(shí)鼠標(biāo)在目標(biāo)元素上移動(dòng)時(shí)觸發(fā).監(jiān)聽(tīng)器通過(guò)阻止瀏覽器默認(rèn)行為設(shè)置元素為可拖放元素.
· dragleave:拖拽時(shí)鼠標(biāo)移出目標(biāo)元素時(shí)在目標(biāo)元素上觸發(fā).此時(shí)監(jiān)聽(tīng)器可以取消掉前面設(shè)置的視覺(jué)效果.
· drag:拖拽期間在被拖拽元素上連續(xù)觸發(fā)
· drop:鼠標(biāo)在拖放目標(biāo)上釋放時(shí),在拖放目標(biāo)上觸發(fā).此時(shí)監(jiān)聽(tīng)器需要收集數(shù)據(jù)并且執(zhí)行所需操作.如果是從操作系統(tǒng)拖放文件到瀏覽器,需要取消瀏覽器默認(rèn)行為.
· dragend:鼠標(biāo)在拖放目標(biāo)上釋放時(shí),在拖拽元素上觸發(fā).將元素從瀏覽器拖放到操作系統(tǒng)時(shí)不會(huì)觸發(fā)此事件.

5，請(qǐng)列舉jquery中的選擇器：
#id，.class，element，:first，:even，:eq(index)，:contains(text)
鏈接：jQuery選擇器

6，Javascript中的定時(shí)器有哪些？他們的區(qū)別及用法是什么？
setTimeout 只執(zhí)行一次
setInterval 會(huì)一直重復(fù)執(zhí)行

7，請(qǐng)描述一下 cookies sessionStorage和localstorage區(qū)別
（1）相同點(diǎn)：都存儲(chǔ)在客戶端
不同點(diǎn)：1.存儲(chǔ)大小
· cookie數(shù)據(jù)大小不能超過(guò)4k。
· sessionStorage和localStorage 雖然也有存儲(chǔ)大小的限制，但比cookie大得多，可以達(dá)到5M或更大。
（2）有效時(shí)間
· localStorage    存儲(chǔ)持久數(shù)據(jù)，瀏覽器關(guān)閉后數(shù)據(jù)不丟失除非主動(dòng)刪除數(shù)據(jù)；
· sessionStorage  數(shù)據(jù)在當(dāng)前瀏覽器窗口關(guān)閉后自動(dòng)刪除。
· cookie          設(shè)置的cookie過(guò)期時(shí)間之前一直有效，即使窗口或?yàn)g覽器關(guān)閉
（3）數(shù)據(jù)與服務(wù)器之間的交互方式
· cookie的數(shù)據(jù)會(huì)自動(dòng)的傳遞到服務(wù)器，服務(wù)器端也可以寫cookie到客戶端
· sessionStorage和localStorage不會(huì)自動(dòng)把數(shù)據(jù)發(fā)給服務(wù)器，僅在本地保存。

8，編寫一個(gè)方法去掉數(shù)組里面重復(fù)的內(nèi)容？
 

var arr = ['abc','abcd','sss','2','d','t','2','ss','f','22','d'];
//定義一個(gè)新的數(shù)組
var s = [];
//遍歷數(shù)組
for(var i = 0;i<arr.length;i++){
    if(s.indexOf(arr[i]) == -1){  //判斷在s數(shù)組中是否存在，不存在則push到s數(shù)組中
        s.push(arr[i]);
    }
}
console.log(s);
//輸出結(jié)果：["abc", "abcd", "sss", "2", "d", "t", "ss", "f", "22"]

9，document.write和innerHTML的區(qū)別：
document.write是直接寫入到頁(yè)面的內(nèi)容流，如果在寫之前沒(méi)有調(diào)用document.open, 瀏覽器會(huì)自動(dòng)調(diào)用open。每次寫完關(guān)閉之后重新調(diào)用該函數(shù)，會(huì)導(dǎo)致頁(yè)面被重寫。
innerHTML則是DOM頁(yè)面元素的一個(gè)屬性，代表該元素的html內(nèi)容。你可以精確到某一個(gè)具體的元素來(lái)進(jìn)行更改。如果想修改document的內(nèi)容，則需要修改document.documentElement.innerElement。
innerHTML將內(nèi)容寫入某個(gè)DOM節(jié)點(diǎn)，不會(huì)導(dǎo)致頁(yè)面全部重繪
innerHTML很多情況下都優(yōu)于document.write，其原因在于其允許更精確的控制要刷新頁(yè)面的那一個(gè)部分。

10，什么是ajax? ajax的步驟？
ajax(異步j(luò)avascript xml) 能夠刷新局部網(wǎng)頁(yè)數(shù)據(jù)而不是重新加載整個(gè)網(wǎng)頁(yè)。
如何使用ajax?
第一步，創(chuàng)建xmlhttprequest對(duì)象，var xmlhttp =new XMLHttpRequest（);XMLHttpRequest對(duì)象用來(lái)和服務(wù)器交換數(shù)據(jù)。
 

var xhttp;
if (window.XMLHttpRequest) {
//現(xiàn)代主流瀏覽器
xhttp = new XMLHttpRequest();
} else {
// 針對(duì)瀏覽器，比如IE5或IE6
xhttp = new ActiveXObject("Microsoft.XMLHTTP");
}

第二步，使用xmlhttprequest對(duì)象的open（）和send（）方法發(fā)送資源請(qǐng)求給服務(wù)器。
第三步，使用xmlhttprequest對(duì)象的responseText或responseXML屬性獲得服務(wù)器的響應(yīng)。
第四步，onreadystatechange函數(shù)，當(dāng)發(fā)送請(qǐng)求到服務(wù)器，我們想要服務(wù)器響應(yīng)執(zhí)行一些功能就需要使用onreadystatechange函數(shù)，每次xmlhttprequest對(duì)象的readyState發(fā)生改變都會(huì)觸發(fā)onreadystatechange函數(shù)。

11，xml和json的區(qū)別
·  JSON相對(duì)于XML來(lái)講，數(shù)據(jù)的體積小，傳遞的速度更快些
·  JSON與JavaScript的交互更加方便，更容易解析處理，更好的數(shù)據(jù)交互
·  XML對(duì)數(shù)據(jù)描述性比較好；
·  JSON的速度要遠(yuǎn)遠(yuǎn)快于XML；

12，js有幾種數(shù)據(jù)類型，其中基本數(shù)據(jù)類型有哪些
五種基本類型: Undefined、Null、Boolean、Number和String。
引用類型: Object、Array和Function。

13，undefined和null的區(qū)別
null： Null類型，代表“空值”，代表一個(gè)空對(duì)象指針，使用typeof運(yùn)算得到 “object”，所以你可以認(rèn)為它是一個(gè)特殊的對(duì)象值。
undefined： Undefined類型，當(dāng)一個(gè)聲明了一個(gè)變量未初始化時(shí)，得到的就是undefined。
null是javascript的關(guān)鍵字，可以認(rèn)為是對(duì)象類型，它是一個(gè)空對(duì)象指針，和其它語(yǔ)言一樣都是代表“空值”，不過(guò) undefined 卻是javascript才有的。undefined是在ECMAScript第三版引入的，為了區(qū)分空指針對(duì)象和未初始化的變量，它是一個(gè)預(yù)定義的全局變量。沒(méi)有返回值的函數(shù)返回為undefined，沒(méi)有實(shí)參的形參也是undefined。
javaScript權(quán)威指南： null 和 undefined 都表示“值的空缺”，你可以認(rèn)為undefined是表示系統(tǒng)級(jí)的、出乎意料的或類似錯(cuò)誤的值的空缺，而null是表示程序級(jí)的、正常的或在意料之中的值的空缺

14，http和https有何區(qū)別？
http是HTTP協(xié)議運(yùn)行在TCP之上。所有傳輸?shù)膬?nèi)容都是明文，客戶端和服務(wù)器端都無(wú)法驗(yàn)證對(duì)方的身份。
https是HTTP運(yùn)行在SSL/TLS之上，SSL/TLS運(yùn)行在TCP之上。所有傳輸?shù)膬?nèi)容都經(jīng)過(guò)加密，加密采用對(duì)稱加密，但對(duì)稱加密的密鑰用服務(wù)器方的證書進(jìn)行了非對(duì)稱加密。此外客戶端可以驗(yàn)證服務(wù)器端的身份，如果配置了客戶端驗(yàn)證，服務(wù)器方也可以驗(yàn)證客戶端的身份。

15，常見(jiàn)的HTTP狀態(tài)碼
2開(kāi)頭 （請(qǐng)求成功）表示成功處理了請(qǐng)求的狀態(tài)代碼。
200   （成功）  服務(wù)器已成功處理了請(qǐng)求。 通常，這表示服務(wù)器提供了請(qǐng)求的網(wǎng)頁(yè)。 
201   （已創(chuàng)建）  請(qǐng)求成功并且服務(wù)器創(chuàng)建了新的資源。 
202   （已接受）  服務(wù)器已接受請(qǐng)求，但尚未處理。 
203   （非授權(quán)信息）  服務(wù)器已成功處理了請(qǐng)求，但返回的信息可能來(lái)自另一來(lái)源。 
204   （無(wú)內(nèi)容）  服務(wù)器成功處理了請(qǐng)求，但沒(méi)有返回任何內(nèi)容。 
205   （重置內(nèi)容） 服務(wù)器成功處理了請(qǐng)求，但沒(méi)有返回任何內(nèi)容。
206   （部分內(nèi)容）  服務(wù)器成功處理了部分 GET 請(qǐng)求。
3開(kāi)頭 （請(qǐng)求被重定向）表示要完成請(qǐng)求，需要進(jìn)一步操作。 通常，這些狀態(tài)代碼用來(lái)重定向。
300   （多種選擇）  針對(duì)請(qǐng)求，服務(wù)器可執(zhí)行多種操作。 服務(wù)器可根據(jù)請(qǐng)求者 (user agent) 選擇一項(xiàng)操作，或提供操作列表供請(qǐng)求者選擇。 
301   （永久移動(dòng)）  請(qǐng)求的網(wǎng)頁(yè)已永久移動(dòng)到新位置。 服務(wù)器返回此響應(yīng)（對(duì) GET 或 HEAD 請(qǐng)求的響應(yīng)）時(shí)，會(huì)自動(dòng)將請(qǐng)求者轉(zhuǎn)到新位置。
302   （臨時(shí)移動(dòng)）  服務(wù)器目前從不同位置的網(wǎng)頁(yè)響應(yīng)請(qǐng)求，但請(qǐng)求者應(yīng)繼續(xù)使用原有位置來(lái)進(jìn)行以后的請(qǐng)求。
303   （查看其他位置） 請(qǐng)求者應(yīng)當(dāng)對(duì)不同的位置使用單獨(dú)的 GET 請(qǐng)求來(lái)檢索響應(yīng)時(shí)，服務(wù)器返回此代碼。
304   （未修改） 自從上次請(qǐng)求后，請(qǐng)求的網(wǎng)頁(yè)未修改過(guò)。 服務(wù)器返回此響應(yīng)時(shí)，不會(huì)返回網(wǎng)頁(yè)內(nèi)容。 
305   （使用代理） 請(qǐng)求者只能使用代理訪問(wèn)請(qǐng)求的網(wǎng)頁(yè)。 如果服務(wù)器返回此響應(yīng)，還表示請(qǐng)求者應(yīng)使用代理。 
307   （臨時(shí)重定向）  服務(wù)器目前從不同位置的網(wǎng)頁(yè)響應(yīng)請(qǐng)求，但請(qǐng)求者應(yīng)繼續(xù)使用原有位置來(lái)進(jìn)行以后的請(qǐng)求。
4開(kāi)頭 （請(qǐng)求錯(cuò)誤）這些狀態(tài)代碼表示請(qǐng)求可能出錯(cuò)，妨礙了服務(wù)器的處理。
400   （錯(cuò)誤請(qǐng)求） 服務(wù)器不理解請(qǐng)求的語(yǔ)法。 
401   （未授權(quán)） 請(qǐng)求要求身份驗(yàn)證。 對(duì)于需要登錄的網(wǎng)頁(yè)，服務(wù)器可能返回此響應(yīng)。 
403   （禁止） 服務(wù)器拒絕請(qǐng)求。
404   （未找到） 服務(wù)器找不到請(qǐng)求的網(wǎng)頁(yè)。
405   （方法禁用） 禁用請(qǐng)求中指定的方法。 
406   （不接受） 無(wú)法使用請(qǐng)求的內(nèi)容特性響應(yīng)請(qǐng)求的網(wǎng)頁(yè)。 
407   （需要代理授權(quán)） 此狀態(tài)代碼與 401（未授權(quán)）類似，但指定請(qǐng)求者應(yīng)當(dāng)授權(quán)使用代理。
408   （請(qǐng)求超時(shí)）  服務(wù)器等候請(qǐng)求時(shí)發(fā)生超時(shí)。 
409   （沖突）  服務(wù)器在完成請(qǐng)求時(shí)發(fā)生沖突。 服務(wù)器必須在響應(yīng)中包含有關(guān)沖突的信息。 
410   （已刪除）  如果請(qǐng)求的資源已永久刪除，服務(wù)器就會(huì)返回此響應(yīng)。 
411   （需要有效長(zhǎng)度） 服務(wù)器不接受不含有效內(nèi)容長(zhǎng)度標(biāo)頭字段的請(qǐng)求。 
412   （未滿足前提條件） 服務(wù)器未滿足請(qǐng)求者在請(qǐng)求中設(shè)置的其中一個(gè)前提條件。 
413   （請(qǐng)求實(shí)體過(guò)大） 服務(wù)器無(wú)法處理請(qǐng)求，因?yàn)檎?qǐng)求實(shí)體過(guò)大，超出服務(wù)器的處理能力。 
414   （請(qǐng)求的 URI 過(guò)長(zhǎng)） 請(qǐng)求的 URI（通常為網(wǎng)址）過(guò)長(zhǎng)，服務(wù)器無(wú)法處理。 
415   （不支持的媒體類型） 請(qǐng)求的格式不受請(qǐng)求頁(yè)面的支持。 
416   （請(qǐng)求范圍不符合要求） 如果頁(yè)面無(wú)法提供請(qǐng)求的范圍，則服務(wù)器會(huì)返回此狀態(tài)代碼。 
417   （未滿足期望值） 服務(wù)器未滿足"期望"請(qǐng)求標(biāo)頭字段的要求。
5開(kāi)頭（服務(wù)器錯(cuò)誤）這些狀態(tài)代碼表示服務(wù)器在嘗試處理請(qǐng)求時(shí)發(fā)生內(nèi)部錯(cuò)誤。 這些錯(cuò)誤可能是服務(wù)器本身的錯(cuò)誤，而不是請(qǐng)求出錯(cuò)。
500   （服務(wù)器內(nèi)部錯(cuò)誤）  服務(wù)器遇到錯(cuò)誤，無(wú)法完成請(qǐng)求。 
501   （尚未實(shí)施） 服務(wù)器不具備完成請(qǐng)求的功能。 例如，服務(wù)器無(wú)法識(shí)別請(qǐng)求方法時(shí)可能會(huì)返回此代碼。 
502   （錯(cuò)誤網(wǎng)關(guān)） 服務(wù)器作為網(wǎng)關(guān)或代理，從上游服務(wù)器收到無(wú)效響應(yīng)。 
503   （服務(wù)不可用） 服務(wù)器目前無(wú)法使用（由于超載或停機(jī)維護(hù)）。 通常，這只是暫時(shí)狀態(tài)。 
504   （網(wǎng)關(guān)超時(shí)）  服務(wù)器作為網(wǎng)關(guān)或代理，但是沒(méi)有及時(shí)從上游服務(wù)器收到請(qǐng)求。 
505   （HTTP 版本不受支持） 服務(wù)器不支持請(qǐng)求中所用的 HTTP 協(xié)議版本。

16，如何進(jìn)行網(wǎng)站性能優(yōu)化
（1）目的： 從用戶角度而言，優(yōu)化能夠讓頁(yè)面加載得更快、對(duì)用戶的操作響應(yīng)得更及時(shí)，能夠給用戶提供更為友好的體驗(yàn)。從服務(wù)商角度而言，優(yōu)化能夠減少頁(yè)面請(qǐng)求數(shù)、或者減小請(qǐng)求所占帶寬，能夠節(jié)省可觀的資源。
（2）措施： 
——減少HTTP請(qǐng)求數(shù)。
——使用緩存。
——腳本的無(wú)阻塞加載。
——內(nèi)聯(lián)腳本的位置優(yōu)化等。
——Javascript中的DOM 操作優(yōu)化、CSS選擇符優(yōu)化。
——圖片編碼優(yōu)化，懶加載。
——使用負(fù)載均衡方案。

17，什么是mvvm，mvc？區(qū)別？
（1）MVC（Model-View-Controller）
MVC是比較直觀的架構(gòu)模式，用戶操作->View（負(fù)責(zé)接收用戶的輸入操作）->Controller（業(yè)務(wù)邏輯處理）->Model（數(shù)據(jù)持久化）->View（將結(jié)果反饋給View）。MVC使用非常廣泛，比如JavaEE中的SSH框架。
（2）MVVM（Model-View-ViewModel）
如果說(shuō)MVP是對(duì)MVC的進(jìn)一步改進(jìn)，那么MVVM則是思想的完全變革。它是將“數(shù)據(jù)模型數(shù)據(jù)雙向綁定”的思想作為核心，因此在View和Model之間沒(méi)有聯(lián)系，通過(guò)ViewModel進(jìn)行交互，而且Model和ViewModel之間的交互是雙向的，因此視圖的數(shù)據(jù)的變化會(huì)同時(shí)修改數(shù)據(jù)源，而數(shù)據(jù)源數(shù)據(jù)的變化也會(huì)立即反應(yīng)view。微信小程序前端使用mvvm。

18，px和em的區(qū)別
px表示像素 (計(jì)算機(jī)屏幕上的一個(gè)點(diǎn)：1px = 1/96in)，是絕對(duì)單位，不會(huì)因?yàn)槠渌氐某叽缱兓兓?br /> em表示相對(duì)于父元素的字體大小。em是相對(duì)單位 ，沒(méi)有一個(gè)固定的度量值，而是由其他元素尺寸來(lái)決定的相對(duì)值。

19，優(yōu)雅降級(jí)和漸進(jìn)增強(qiáng)
漸進(jìn)增強(qiáng)（Progressive Enhancement）：一開(kāi)始就針對(duì)低版本瀏覽器進(jìn)行構(gòu)建頁(yè)面，完成基本的功能，然后再針對(duì)高級(jí)瀏覽器進(jìn)行效果、交互、追加功能達(dá)到更好的體驗(yàn)。
優(yōu)雅降級(jí)（Graceful Degradation）：一開(kāi)始就構(gòu)建站點(diǎn)的完整功能，然后針對(duì)瀏覽器測(cè)試和修復(fù)。比如一開(kāi)始使用 CSS3 的特性構(gòu)建了一個(gè)應(yīng)用，然后逐步針對(duì)各大瀏覽器進(jìn)行 hack 使其可以在低版本瀏覽器上正常瀏覽。
其實(shí)漸進(jìn)增強(qiáng)和優(yōu)雅降級(jí)并非什么新概念，只是舊的概念換了一個(gè)新的說(shuō)法。在傳統(tǒng)軟件開(kāi)發(fā)中，經(jīng)常會(huì)提到向上兼容和向下兼容的概念。漸進(jìn)增強(qiáng)相當(dāng)于向上兼容，而優(yōu)雅降級(jí)相當(dāng)于向下兼容。

20， JS哪些操作會(huì)造成內(nèi)存泄露
（1）意外的全局變量引起的內(nèi)存泄露。
 

function leak(){  
  leak="xxx";//leak成為一個(gè)全局變量，不會(huì)被回收  
}

（2）閉包引起的內(nèi)存泄露。
（3）沒(méi)有清理的DOM元素引用。
（4）被遺忘的定時(shí)器或者回調(diào) 5）子元素存在引起的內(nèi)存泄露。

21，什么是閉包，如何使用它，為什么要使用它？
閉包就是能夠讀取其他函數(shù)內(nèi)部變量的函數(shù)。由于在Javascript語(yǔ)言中，只有函數(shù)內(nèi)部的子函數(shù)才能讀取局部變量，因此可以把閉包簡(jiǎn)單理解成“定義在一個(gè)函數(shù)內(nèi)部的函數(shù)”。
所以，在本質(zhì)上，閉包就是將函數(shù)內(nèi)部和函數(shù)外部連接起來(lái)的一座橋梁。閉包可以用在許多地方。它的最大用處有兩個(gè)，一個(gè)是前面提到的可以讀取函數(shù)內(nèi)部的變量，另一個(gè)就是讓這些變量的值始終保持在內(nèi)存中。
使用閉包的注意點(diǎn)：
· 由于閉包會(huì)使得函數(shù)中的變量都被保存在內(nèi)存中，內(nèi)存消耗很大，所以不能濫用閉包，否則會(huì)造成網(wǎng)頁(yè)的性能問(wèn)題，在IE中可能導(dǎo)致內(nèi)存泄露。解決方法是，在退出函數(shù)之前，將不使用的局部變量全部刪除。
· 閉包會(huì)在父函數(shù)外部，改變父函數(shù)內(nèi)部變量的值。所以，如果你把父函數(shù)當(dāng)作對(duì)象（object）使用，把閉包當(dāng)作它的公用方法（Public Method），把內(nèi)部變量當(dāng)作它的私有屬性（private value），這時(shí)一定要小心，不要隨便改變父函數(shù)內(nèi)部變量的值。

22，請(qǐng)解釋一下JavaScript的同源策略。
在客戶端編程語(yǔ)言中，如javascript和 ActionScript，同源策略是一個(gè)很重要的安全理念，它在保證數(shù)據(jù)的安全性方面有著重要的意義。同源策略規(guī)定跨域之間的腳本是隔離的，一個(gè)域的腳本不能訪問(wèn)和操作另外一個(gè)域的絕大部分屬性和方法。那么什么叫相同域，什么叫不同的域呢？當(dāng)兩個(gè)域具有相同的協(xié)議, 相同的端口，相同的host，那么我們就可以認(rèn)為它們是相同的域。同源策略還應(yīng)該對(duì)一些特殊情況做處理，比如限制file協(xié)議下腳本的訪問(wèn)權(quán)限。本地的HTML文件在瀏覽器中是通過(guò)file協(xié)議打開(kāi)的，如果腳本能通過(guò)file協(xié)議訪問(wèn)到硬盤上其它任意文件，就會(huì)出現(xiàn)安全隱患，目前IE8還有這樣的隱患。

23，怎樣添加、移除、移動(dòng)、復(fù)制、創(chuàng)建和查找節(jié)點(diǎn)？
（1）創(chuàng)建新節(jié)點(diǎn)
 

createDocumentFragment() //創(chuàng)建一個(gè)DOM片段
createElement() //創(chuàng)建一個(gè)具體的元素
createTextNode() //創(chuàng)建一個(gè)文本節(jié)點(diǎn)

（2）添加、移除、替換、插入
 

appendChild() //添加
removeChild() //移除
replaceChild() //替換
insertBefore() //插入

（3）查找
 

getElementsByTagName() //通過(guò)標(biāo)簽名稱
getElementsByName() //通過(guò)元素的Name屬性的值
getElementById() //通過(guò)元素Id，唯一性

24，瀏覽器是如何渲染頁(yè)面的？
渲染的流程如下：
1.解析HTML文件，創(chuàng)建DOM樹(shù)。
自上而下，遇到任何樣式（link、style）與腳本（script）都會(huì)阻塞（外部樣式不阻塞后續(xù)外部腳本的加載）。
2.解析CSS。優(yōu)先級(jí)：瀏覽器默認(rèn)設(shè)置<用戶設(shè)置<外部樣式<內(nèi)聯(lián)樣式<HTML中的style樣式。
3.將CSS與DOM合并，構(gòu)建渲染樹(shù)（Render Tree）。
4.布局和繪制，重繪（repaint）和重排（reflow）。

25，從輸入url到顯示頁(yè)面，都經(jīng)歷了什么？
一般會(huì)經(jīng)歷以下幾個(gè)過(guò)程：
1、首先，在瀏覽器地址欄中輸入url。
2、瀏覽器先查看瀏覽器緩存-系統(tǒng)緩存-路由器緩存，如果緩存中有，會(huì)直接在屏幕中顯示頁(yè)面內(nèi)容。若沒(méi)有，則跳到第三步操作。
3、在發(fā)送http請(qǐng)求前，需要域名解析(DNS解析)(DNS（域名系統(tǒng)，Domain Name System）是互聯(lián)網(wǎng)的一項(xiàng)核心服務(wù)，它作為可以將域名和IP地址相互映射的一個(gè)分布式數(shù)據(jù)庫(kù)，能夠使人更方便的訪問(wèn)互聯(lián)網(wǎng)，而不用去記住IP地址。)，解析獲取相應(yīng)的IP地址。
4、瀏覽器向服務(wù)器發(fā)起tcp連接，與瀏覽器建立tcp三次握手。（TCP即傳輸控制協(xié)議。TCP連接是互聯(lián)網(wǎng)連接協(xié)議集的一種。）
5、握手成功后，瀏覽器向服務(wù)器發(fā)送http請(qǐng)求，請(qǐng)求數(shù)據(jù)包。
6、服務(wù)器處理收到的請(qǐng)求，將數(shù)據(jù)返回至瀏覽器。
7、瀏覽器收到HTTP響應(yīng)。
8、讀取頁(yè)面內(nèi)容，瀏覽器渲染，解析html源碼。
9、生成Dom樹(shù)、解析css樣式、js交互。
10、客戶端和服務(wù)器交互。
11、ajax查詢。

26，display:none和visibility:hidden區(qū)別？
1.display:none是徹底消失，不在文檔流中占位，瀏覽器也不會(huì)解析該元素；visibility:hidden是視覺(jué)上消失了，可以理解為透明度為0的效果，在文檔流中占位，瀏覽器會(huì)解析該元素；
2.使用visibility:hidden比display:none性能上要好，display:none切換顯示時(shí)visibility，頁(yè)面產(chǎn)生回流（當(dāng)頁(yè)面中的一部分元素需要改變規(guī)模尺寸、布局、顯示隱藏等，頁(yè)面重新構(gòu)建，此時(shí)就是回流。所有頁(yè)面第一次加載時(shí)需要產(chǎn)生一次回流），而visibility切換是否顯示時(shí)則不會(huì)引起回流。

27，JavaScript中如何檢測(cè)一個(gè)變量是一個(gè)String類型？請(qǐng)寫出函數(shù)實(shí)現(xiàn)
 

typeof(obj) === "string"
typeof obj === "string"
obj.constructor === String

28，判斷一個(gè)字符串中出現(xiàn)次數(shù)最多的字符，統(tǒng)計(jì)這個(gè)次數(shù)
 

var str = 'asdfssaaasasasasaa';
var json = {};
for (var i = 0; i < str.length; i++) {
    if(!json[str.charAt(i)]){
       json[str.charAt(i)] = 1;
    }else{
       json[str.charAt(i)]++;
    }
};
var iMax = 0;var iIndex = '';for(var i in json){
    if(json[i]>iMax){
         iMax = json[i];
         iIndex = i;
    }
}       
console.log('出現(xiàn)次數(shù)最多的是:'+iIndex+'出現(xiàn)'+iMax+'次');

29，$(document).ready()方法和window.onload有什么區(qū)別？
 (1)、window.onload方法是在網(wǎng)頁(yè)中所有的元素(包括元素的所有關(guān)聯(lián)文件)完全加載到瀏覽器后才執(zhí)行的。
 (2)、$(document).ready() 方法可以在DOM載入就緒時(shí)就對(duì)其進(jìn)行操縱，并調(diào)用執(zhí)行綁定的函數(shù)。

30，jquery中$.get()提交和$.post()提交有區(qū)別嗎？
相同點(diǎn)：都是異步請(qǐng)求的方式來(lái)獲取服務(wù)端的數(shù)據(jù)；
不同點(diǎn)：
（1）請(qǐng)求方式不同：$.get() 方法使用GET方法來(lái)進(jìn)行異步請(qǐng)求的。$.post() 方法使用POST方法來(lái)進(jìn)行異步請(qǐng)求的。
（2）參數(shù)傳遞方式不同：get請(qǐng)求會(huì)將參數(shù)跟在URL后進(jìn)行傳遞，而POST請(qǐng)求則是作為HTTP消息的實(shí)體內(nèi)容發(fā)送給Web服務(wù)器的，這種傳遞是對(duì)用戶不可見(jiàn)的。
（3）數(shù)據(jù)傳輸大小不同：get方式傳輸?shù)臄?shù)據(jù)大小不能超過(guò)2KB 而POST要大的多。
（4）安全問(wèn)題： GET 方式請(qǐng)求的數(shù)據(jù)會(huì)被瀏覽器緩存起來(lái)，因此有安全問(wèn)題。

最新評(píng)論