Web前端面試題整理2

請多多指教；

1. 對網站的檔案和資源進行最佳化

   .檔案合併：將一些需要經常載入的圖片合併成一張圖片，透過位置來獲取圖片中的內容，減少http的請求次數；

   .快取的使用

   .css放在head中，js放在文件末尾

   .書寫程式碼最佳化

2. 優雅降級和漸進增強

   優雅降級：構建站點的完整功能，再針對瀏覽器測試和修復（-webkit-,-moz-,-o-）

   漸進增強：構建站點最少特性，然後針對各瀏覽器追加功能(-o-,-moz-,-webkit-)

3. 媒體查詢：

   針對不同的媒體型別定義不同的型別

   //如果視窗小於100px的樣式

   @media screen and (max-width<100px){

   body{}

   }

4. css實現輪播

   元素{

   animation:change 3s infinite;

   }

   @keyframes change{

     //from{}to{}

     10%{}50%{}100{}

     }

5.瀏覽器相容問題

.不同瀏覽器的標籤預設的外補丁和內補丁不同；解決：*{margin:0;padding:0}

.圖片預設有間距;解決：使用float為img佈局

6.點選ul的幾個li元素，彈出他們的序號

第一種：使用屬性:將li元素上加入序號屬性

第二種：使用閉包：

for(var i=0;i<$(".li").length;i++) {
    (function (i) {
        $(".li").eq(i).click(function () {
            alert(i)
        })
    })
    (i)
}

第三種設定index儲存：

$(".li")[i].index = i;