記錄下筆記，大神勿噴，可以留下優化建議，謝謝
最近剛剛做了個展示型的網站，使用swiper搭的框架，因為圖片比較多，所 以首次加載稍微有些慢，雖然壓縮過了，但是盡可能的優化吧，剛開始找了個懶加載的一個插件，但沒想到怎么跟swiper結合使用，就自己寫了個方法，但原理是一樣的，就是swiper除了首屏的圖片加載以外，其他頁面的圖片不加載，也就是src屬性不給賦值，然后當每次滑動到下一屏的時候圖片在加載，可以優化初次加載過慢。
首先，除了首屏的圖片正常加載以外，其他頁面的img標簽正常寫入，但不給src賦值，自定義屬性data-original=“img/secondPage/2_text.png”，自定義屬性的值為你img中src所要加載的圖片
<img class="dataImg" data-original="img/secondPage/2_text.png" data-original@2x="img/secondPage/2_text@2x.png" />
當然細心的同學會看到還有個data-original@2x的屬性，其實很明顯，做適配用的，這個一會在做解釋。
然后js定義個函數
這個函數需要傳個值，就是swiper下面每頁的下標值index，然后循環每頁的img，通過attr把data-original的值賦給src，當然你會看到一個判斷，也可以看得出是判斷設備的像素比的，然后加載不同倍數的圖片，這就是上面定義data-original@2x的原因
最后調用，swiper有個方法是onSlideChangeStart，就是改變每一屏的時候執行，
index值可以通過swiper的屬性獲取，當滑動的時候就可以加載下一屏的圖片了，當然首屏的圖片是提前加載好的，所以是!0的時候執行
請大神留下寶貴建議，謝謝