大家都知道,一張圖片就是一個<img>
標簽,而圖片的來源主要是src屬性鸥鹉。瀏覽器是否發(fā)起親求就是根據(jù)是否有src
屬性決定的。既然這樣庶骄,那么我們就要對<img>
標簽的src
屬性下手了毁渗,在沒進入可視區(qū)域的時候,我們先不給這個<img>
標簽賦src
屬性单刁,這樣豈不是瀏覽器就不會發(fā)送請求了灸异。
總結(jié):我們知道了從<img>
標簽下手,那么更重要的就是可視區(qū)域的判斷了羔飞,這就是核心之處了肺樟。
IMG_20190222_114404.jpg
最后:
將頁面里所有img
屬性src
屬性用data-xx
代替,當頁面滾動直至此圖片出現(xiàn)在可視區(qū)域時逻淌,用js
取到該圖片的data-xx
的值賦給src
么伯。
其它:
設(shè)置圖片外層容器背景圖 5k 左右,然后內(nèi)層img
標簽放圖片