html

瀏覽器緩存？ cache-control？

瀏覽器緩存分為強緩存和協(xié)商緩存在請求的時候會根據(jù)http請求頭判斷是否命中強緩存：如果命中則加載緩存中的數(shù)據(jù)，不會發(fā)送請求如果沒有命中則瀏覽器請求服務器，服務器會判斷本地緩存是否有效？有效則加載本地數(shù)據(jù)，服務器不返回信息如果命中的是協(xié)商緩存則服務器會根據(jù)請求把數(shù)據(jù)返回，瀏覽器加載數(shù)據(jù)并更新本地緩存

// cache-control 在header中設置用來控制瀏覽器緩存行為

public： http通信的過程中，包括請求的發(fā)起方（瀏覽器）、代理緩存服務器都可以進行緩存。 private ：只允許請求的發(fā)起方（瀏覽器）進行緩存。 no-cache：可以在請求的發(fā)起方（瀏覽器）進行緩存，但是每次都需要去服務器進行資源驗證。 no-store：任何地方都不可以緩存。

Html離線存儲？

在瀏覽器得html頭部加上manifest屬性，如果是第一次訪問瀏覽器會根據(jù)manifest 得內容進行下載存儲離線內容，如果已經訪問過則從離線存儲中進行加載，然后在比對服務器如果有新內容在更新離線存儲

svg和canvas 的區(qū)別？

svg 輸出的圖形都有獨立的dom 是一個矢量圖形 放大縮小不會 canvas 輸出的是一整塊 是一個畫布 放大 縮小會失貞

src 和 href 的區(qū)別？

src 是引入資源的 href 是跳轉url的

前端有哪三層構成，分別是什么？

結構層 html dom結構表示層 css 渲染行為層 js操作

什么是標簽語義？有什么作用？

即使在沒有css的情況下 頁面代碼也能很好的被閱讀理解，用正確的標簽 能夠對瀏覽器和搜索引擎的支持更好。便于后期的維護。

常見的瀏覽器內核有哪些？以及你對內核的了解？

IE(trident) chrome safari(webkit) firefox(gecko) opera(presto) 分為渲染引擎和js 引擎渲染引擎 負責 取得網頁的html css 圖像 等信息 然后根據(jù)css 將頁面渲染出來 js 引擎 則負責頁面數(shù)據(jù)或者動態(tài)效果的處理

cookie、session、localstroage、sessionStorage 的區(qū)別？優(yōu)缺點？

session存在于服務端不在客戶端

cookie 是用于和服務端通信，其他兩個則不會

cookie 有大小限制相對于其他兩個，單個不超過4kb，個數(shù)不超過150個，超過4kb不會被設置，超過150個視各瀏覽器不同，刪舊留新

localStorage 數(shù)據(jù)永遠存儲，除非你主動刪除 如果超過5mb會報錯 sessionStorage 數(shù)據(jù)在瀏覽器關閉之前一直存在

input如何監(jiān)聽值的變化？

可以監(jiān)聽input 的 focus 或者 keydown 屬性

輸入URL后發(fā)生了什么？

首先 從DNS解析域名 獲取ip地址，根據(jù)ip地址 找到服務器，服務器根據(jù)地址請求 返回頁面相關數(shù)據(jù)，瀏覽器獲取到數(shù)據(jù)進行頁面加載渲染頁面

瀏覽器的渲染過程？

1、將獲取的html解析成dom樹

2、處理css，構成層疊樣式表模型CSSOM

3、將dom樹和CSSOM合并為渲染樹

4、根據(jù)CSSOM將渲染樹的節(jié)點布局計算

5、將渲染樹節(jié)點樣式繪制到頁面上

// 注意在渲染的過程中是自上而下渲染， js會阻塞頁面的渲染，優(yōu)先等js執(zhí)行完成如果在渲染的過程中改變了樣式，會造成回流需要重新渲染

總結

到此這篇關于2020前端面試題之HTML篇的文章就介紹到這了,更多相關2020前端面試題html內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章，希望大家以后多多支持腳本之家！