面完現在才後知後覺，這個作用，應該從優先順序，快取，效能各方面來回答。

1.優先順序：（1）寫在標籤裡的style屬性，內嵌樣式（優先順序更高），寫在HTML中的style標籤裡面的內部樣式表（次之），還有通過link標籤引入的CSS樣式外聯樣式（最低）。

2.快取：外聯樣式靜態資源直接載入進來渲染就ok。style和inline樣式肯定會阻塞頁面的載入和呈現。

• 怎樣可以覆蓋父級DIV的樣式。用什麼辦法？

我說到了選擇器，但是好像也說的不是很清楚。（父級選擇器和內容選擇器。）
當時腦子短路沒有想到important，他在選擇器中優先順序是最高。

！important > 內嵌樣式 > ID > 類選擇器 > 標籤選擇器|偽類|屬性選擇器 > 偽對像 > 繼承 > 萬用字元。

1. 在同一組屬性設定中標有“!important“規則的優先順序最大
div{
margin-left:20px!important;
margin-left:40px;
}

2.繼承css樣式不如後來指定的CSS樣式。

3.開發者的規則高於瀏覽者，這個是肯定的。

• 垂直居中方式（大概說了好幾種吧，不按套路出牌，咋不問垂直水平居中啊。）
• 下面幾種方式。
  

  注：前面幾種都是在知道自己高度和父容器高度的情況下：
  1.利用絕對定位和transform。

.parent{
    position: relative;
}
.son{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

2.用絕對定位和margin

.parent{
    position: relative;
}
.son{
    position: absolute;
    top: 50%;
    margin-top: //高度的一般
}

3.用彈性盒佈局Flex;這個不用管元素的高低。（垂直水平居中）

.parent{
    display: flex;
    justify-content:center;//設定盒子元素在主軸方向上的對齊方式；
    align-items:center;//側軸方向上的對齊方式
}

4.使用插入table標籤。（垂直水平居中）

.parent{
    display:table-cell;
    vertical-align: middle;
    text-align: center;
}
.son{
    margin:0 auto;//如果是塊級元素
    display:inline-block;//如果行級元素
}

5.垂直水平居中

.parent{
    position: relative;
}
.son{
    position: absolute;
    margin:auto;
}

6.基線對其方式：這個不是很懂

.parent{
    text-align: center; 
}
.sonTemp .son{
    vertical-align: middle;
    display: inline-block;
}

原理：設定一個參照物，和容器一樣高，然後在父級設定水平對齊方式text-align:center在參照物和子級設定基線對其方式vartical-align:middle.需將參照物和子級都設成行內塊display:inline-block.

• jsonp有了解嗎？

jsonp是json的一種使用模式，可以讓網頁從別的域名那獲取資料，即跨域讀取資料。jsonp是被包含在函式呼叫中的json。

它包含資料和函式兩個部分。回撥函式是當響應到來時應在頁面中呼叫的函式。回撥函式的名字一般是在請求中指定的，資料就是傳入回撥函式中的json資料。

• jsonp跨域，為什麼會有同源策略，跨域的方式。

  1.為什麼會有同源策略

web方面規則的出現一般都是為了解決安全問題吧。之所以有同源策略，一個很重要的原因就是對cookie的保護吧。
cookie中存著sessionID.黑客一旦獲取sessionID並且在有效期內，就可以登入了；
如果我們訪問一個惡意網站，沒有同源策略，那麼網站就能通過js訪問document.cookie得到關於使用者的登陸資訊一類的東西。這不就完蛋了。

2.跨域。面試官只讓我說了jsonp。

說了它借用<script>標籤不受同源策略限制原理。為src屬性指定一個跨域的url。因為jsonp是有效的js程式碼，所以在請求完成之後，即在jsonp響應載入到頁面中之後，會立即執行。

優點:簡單易用；能夠直接訪問響應文字，支援在瀏覽器和伺服器之間雙向通訊。

缺點：（1）jsonp是從其它域中載入程式碼執行。如果其它域中不安全，很可能在響應中新增一些惡意程式碼。 （2）判斷它是否請求失敗很不容易。h5中提出z在<script>一個onerror事件處理程式，但還沒有得到大多數瀏覽器支援。

3.CORS實現跨域

說一下cors吧：它通過自定義HTTP頭部讓瀏覽器與伺服器進行溝通，從而決定請求響應是否應該成功。在傳送該請求的時候，我們在頭部設定一個Origin，如果伺服器同意i訪問，就在Access-Control-Allow-Origin頭部中回發相同的源資訊。

兩者區別：（1）cors比jsonp除get要求方法以外也支援其他的http請求技術。（2）cors可用一般的XMLhttpRequest,這種方式錯誤處理方式更好（3）更加安全，請求和響應都不包括cooies資訊。

補充一下：

303：see other該狀態碼錶示由於請求對應的資源存在著另一個url，應使用get方法定向獲取請求的資源。303明確表示客戶端應當採用get方法獲取資源，這點與302狀態碼有區別。

302:臨時性的重定向。該狀態嗎表示請求的資源已被分配了新的url，希望使用者能使用新的url進行訪問。302表示的資源不是永久移動，只是臨時性。也就是說已經移動的資源對應的url將來還是有可能發生變化。

301:永久性定向。該狀態碼錶示請求的資源已被分配了新的url，以後使用該資源現在所指的URL.

307:Temporary Redirect :臨時重定向。該狀態碼與302有相同的含義。儘管302標準禁止post變化get，但實際使用時大家不遵守。 307會遵照瀏覽器標準，不會從post變為get。但是對於處理響應時的行為，各種瀏覽器有可能出現不同的情況。

503：伺服器超時，伺服器目前無法使用（由於超載或停機維護）。通常，這只是暫時狀態。

• cookie和session（這個之後單獨總結一下吧）。

• promise，看之前的部落格吧，主要解決了什麼。

主要解決了非同步程式設計的問題啊。

• 有什麼想問他的。（我逮住一個機會問了二維碼掃描，超級感謝，他講的也很清楚。）

差不多就是：

首先獲取一個唯一的密碼（也就是二維碼）這個二維碼是將後臺所有session中登陸資訊壓縮而成的一個字串轉換過來的。我們用手機掃描的時候，手機上是登陸狀態，會將uid與調取到手機微信產生的token進行繫結，並且上傳到伺服器，此時，瀏覽器通過長輪詢查詢session,如果匹配，返回201，然後通知伺服器，客戶端由此進入一個新的接面。

總結：

1.總體來說，好多問題也記不太清楚了，這次面試可能很基礎的。（面試官覺得我學的基礎吧）
2.回答還算好吧，但還是不深入，不繫統。
3.最後面試官講的那個二維碼掃描問題，我能記一輩子的，哈哈哈。