刷前端面經筆記(一)

大翰仔仔發表於2019-02-07
1.CSS的盒子模型

包含元素內容content、內邊距padding、邊框border、外邊距margin box-sizing:border-box;content-box;inherit;

  1. content-box:總寬度=margin+border+padding+width,即為標準模型;
  2. border-box:總寬度=margin+width,即為IE模型;
  3. inherit:繼承父元素的border-sizing屬性。
2.AJAX的readyState幾種狀態

0——初始化 1——載入 2——載入完成 3——解析 4——完成

3.常見的post提交資料方式對應的content-type取值

4種 1)application/x-www-form-urlencoded:資料被編碼為名稱/值對,這是標準的編碼格式。 2)multipart/form-data:資料被編碼為一條訊息,頁上的每個控制元件對應訊息中的一個部分。 3)application/json:告訴服務端訊息主體是序列化後的 JSON字串. 4)text/xml

4.清除浮動的幾種方法

1)父級div定義偽類:afterzoom .clearfloat::after {display:block; clear:both; content:" "; visibility:hidden; height:0;} .clearfloat {zoom:1} 2)在結尾處新增空div標籤clear:both 3)父級div定義height 4)父級div定義display:table 5)父級div也一起浮動 6)父級div定義overflow:auto/hidden(必須定義widthzoom:1,同時不能定義height,瀏覽器會自動檢查浮動區域的高度)

5.Webpack解析ES6用的外掛

babel-loader

6.移動端上click事件在某些瀏覽器有沒有遇到延遲的問題

1)靜止縮放 <meta name="viewport" content="width=device-width user-scalable='no' "><meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1"> 2)引入fastclick.jswindow.addEventListener(function(){ FastClick.attach(document.body); 1},false)

7.HTTP的快取機制

1)強制快取:當所請求的資料在快取資料庫中尚未過期時,不與伺服器進行互動,直接使用快取資料庫中的資料。 Expire / Cache-Control 2)協商快取:從快取資料庫中取出快取的標識,然後向瀏覽器傳送請求驗證請求的資料是否已經更新,如果已更新則返回新的資料,若未更新則使用快取資料庫中的快取資料。 etag / last-modifield

歡迎關注

相關文章