BOM
- BOM是browser object model的縮寫，簡稱瀏覽器對象模型癌椿。
- 瀏覽器對象模型提供了獨(dú)立于內(nèi)容的躺坟、可以與瀏覽器窗口進(jìn)行互動的對象結(jié)構(gòu)。
- Window是BOM中的核心對象熊痴。
1. window.onload 和 document.onDOMContentLoaded 有什么區(qū)別他爸？
- 當(dāng)使用window.onload時，頁面上所有的DOM果善、樣式表诊笤、腳本、圖片巾陕、flash都已經(jīng)加載完成讨跟。
- 當(dāng)使用document.onDOMContentLoaded時，僅當(dāng)DOM加載完成不包括樣式表鄙煤、圖片晾匠、flash。
2. 如何獲取圖片真實(shí)的寬高梯刚？
document.querySelector("img").onload = dunction() {
console.log(this.width);
console.log(this.height);
3. 如何獲取元素的真實(shí)寬高凉馆？
//假如我要獲取名為body元素的寬高
console.log(body.offsetHeight)
console.log(body.offsetWidth)
4. URL 如何編碼解碼？
JavaScript中提供了四個URL編碼方法：
- encodeURI()
用于轉(zhuǎn)碼整個 URL亡资。它的參數(shù)是一個字符串句喜，代表整個 URL。它會將元字符和語義字符之外的字符沟于，都進(jìn)行轉(zhuǎn)義咳胃。不會對ASCII字母、數(shù)字旷太、~!@#$&*()=:/,;?+'
字符編碼 展懈。
encodeURI('http://www.example.com/q=春節(jié)')
// "http://www.example.com/q=%E6%98%A5%E8%8A%82"
- encodeURIComponent()
用于轉(zhuǎn)碼 URL 的組成部分，會轉(zhuǎn)碼除了語義字符之外的所有字符供璧，即元字符也會被轉(zhuǎn)碼存崖。所以，它不能用于轉(zhuǎn)碼整個 URL睡毒。它接受一個參數(shù)来惧，就是 URL 的片段。不會對ASCII字母演顾、數(shù)字供搀、~!*()' 字符編碼隅居。
注意：encodeURIComponent()會連 URL 元字符一起轉(zhuǎn)義，所以如果轉(zhuǎn)碼整個 URL 就會出錯葛虐。
encodeURIComponent('春節(jié)')
// "%E6%98%A5%E8%8A%82"
encodeURIComponent('http://www.example.com/q=春節(jié)')
//"http%3A%2F%2Fwww.example.com%2Fq%3D%E6%98%A5%E8%8A%82"
- decodeURI()
用于整個 URL 的解碼胎源。它是encodeURI()方法的逆運(yùn)算。它接受一個參數(shù)屿脐，就是轉(zhuǎn)碼后的 URL涕蚤。
decodeURI('http://www.example.com/q=%E6%98%A5%E8%8A%82')
// "http://www.example.com/q=春節(jié)"
- decodeURIComponent()
用于URL 片段的解碼。它是encodeURIComponent()方法的逆運(yùn)算的诵。它接受一個參數(shù)万栅，就是轉(zhuǎn)碼后的 URL 片段。
decodeURIComponent('%E6%98%A5%E8%8A%82')
// "春節(jié)"
5.為什么要編碼西疤？
- URL就是網(wǎng)址申钩，只要上網(wǎng)，就一定會用到瘪阁。
- 只有字母和數(shù)字[0-9a-zA-Z]、一些特殊符號“$-_.+!*'(),”[不包括雙引號]邮偎、以及某些保留字管跺，才可以不經(jīng)過編碼直接用于URL。
- 如果URL中有漢字禾进，就會導(dǎo)致亂碼豁跑。
- URL參數(shù)字符串中如果包含”&”或者”%”勢必會造成服務(wù)器解析錯誤。
- 不同情況瀏覽器泻云，網(wǎng)頁艇拍，編碼的處理方式不同。也會導(dǎo)致編碼混亂不堪宠纯。
怎么解決上述問題卸夕？
使用Javascript先對URL編碼，然后再向服務(wù)器提交婆瓜，不要給瀏覽器插手的機(jī)會快集。因?yàn)镴avascript的輸出總是一致的，所以就保證了服務(wù)器得到的數(shù)據(jù)是格式統(tǒng)一的廉白。
6. cookie & session &localStorage 分別是什么个初？
cookie
- 會跟隨請求被發(fā)送到服務(wù)器上
- 是存儲在瀏覽器上的一小段數(shù)據(jù)，用來記錄某些當(dāng)頁面關(guān)閉或者刷新后仍然需要記錄的信息
- 一般瀏覽器存儲cookie 最大容量為4k猴蹂，所以大量數(shù)據(jù)不要存到cookie院溺。
- 有個數(shù)限制，不同瀏覽器下磅轻，一個域名下cookie的個數(shù)有限珍逸，并且限制數(shù)量可能不一樣
session
- 當(dāng)一個用戶打開一個頁面登錄后逐虚，刷新瀏覽器仍然展示登錄狀態(tài)。服務(wù)器如何分辨這次發(fā)起請求的用戶是剛才登錄過的用戶呢 這里就使用了session保存狀態(tài)弄息。用戶在輸入用戶名密碼提交給服務(wù)端痊班，服務(wù)端驗(yàn)證通過后會創(chuàng)建一個session用于記錄用戶的相關(guān)信息，這個 session 可保存在服務(wù)器內(nèi)存中摹量，也可保存在數(shù)據(jù)庫中涤伐。
- 創(chuàng)建session后，會把關(guān)聯(lián)的session_id 通過setCookie 添加到http響應(yīng)頭部中缨称。
- 瀏覽器在加載頁面時發(fā)現(xiàn)響應(yīng)頭部有 set-cookie字段凝果，就把這個cookie 種到瀏覽器指定域名下。
- 當(dāng)下次刷新頁面時睦尽，發(fā)送的請求會帶上這條cookie器净， 服務(wù)端在接收到后根據(jù)這個session_id來識別用戶。
- cookie 是存儲在瀏覽器里的一小段「數(shù)據(jù)」当凡，而session是一種讓服務(wù)器能識別某個用戶的「機(jī)制」山害，session 在實(shí)現(xiàn)的過程中需要使用cookie。 二者不是同一維度的東西沿量。
localStorage
- localStorage HTML5本地存儲web storage特性的API之一浪慌，用于將大量數(shù)據(jù)（最大5M）保存在瀏覽器中，保存后數(shù)據(jù)永遠(yuǎn)存在不會失效過期朴则，除非用 js手動清除权纤。
- 不參與網(wǎng)絡(luò)傳輸。
- 一般用于性能優(yōu)化乌妒，可以保存圖片汹想、js、css撤蚊、html 模板古掏、大量數(shù)據(jù)。
- 總體數(shù)量無限制
