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;