異同

alt是圖片加載失敗的時候，顯示在網頁上的替代文字；title是鼠標放在圖片上顯示的提示文字，title是對圖片的描述與進一步說明。

這些都是表面上的區別，alt是img的必要屬性，而title不是。對于網站seo優化來說，title和alt還有最重要的一點就是：搜索引擎對圖片意思的判斷，主要靠alt屬性，所以在圖片alt屬性中要以簡要的文字說明，同時包含關鍵詞，也是頁面優化的一部分。如若條件允許，可以在title屬性里，進一步對圖片進行說明。

由于過多的圖片會嚴重影響網頁的加載速度，并且移動網絡下的流量消耗巨大，所以說延遲加載幾乎是標配了。

懶加載實現方式：

使用定時器進行延遲加載

條件加載：符合某些條件才開始加載

可視區加載，主要由滾動監聽來實現，一般會在距用戶看到某些圖片前的一定距離再開始加載，這樣能保證用戶下拉的時候正好能看見圖片（常用）

懶加載實現原理：

原理很簡單，就是我們先設置圖片的data-set屬性（當然也可以是其他任意的，只要不會發送http請求就行，作用就是為了存取值）值為圖片的src路徑。由于不是src，所以不會發送http請求，然后監聽頁面滾動事件，判斷圖片是否進入可視區，如果是，就將圖片的src屬性設置為data-set的值.

總結

以上是生活随笔為你收集整理的img 的 alt 与 title 的异同，还有实现图片懒加载的原理的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。