現在在網頁設計中，圖片是非常重要的元素之一。而且隨著移動設備的普及，很多設備有不同的屏幕大小，所以圖片的高度自適應顯得尤為重要。下面我們就來介紹一下通過jquery實現圖片高度自適應屏幕的方法。

$(window).on("load resize", function(){
var winHeight = $(window).height(); //獲取窗口高度
var imgHeight = $("#img").height(); //獲取圖片高度
if(imgHeight >winHeight){ //判斷圖片高度是否大于窗口高度
$("#img").height(winHeight); //設置圖片高度為窗口高度
}
});

在上面的代碼中，我們使用了window對象的load和resize事件，當窗口大小改變或者加載完畢之后，就會觸發(fā)這兩個事件。然后我們通過jquery獲取窗口的高度和圖片的高度，判斷如果圖片的高度大于窗口的高度，就設置圖片的高度為窗口的高度，這樣就可以實現圖片高度自適應屏幕。

另外，需要注意的是在設置圖片高度為窗口高度之后，圖片的寬度會發(fā)生變化，我們可以使用CSS的background-size屬性來控制圖片的尺寸，使其能夠鋪滿整個屏幕。

#img{
background-size: cover;
}

通過這種方法，我們可以輕松實現圖片高度自適應屏幕的效果，提高網站的用戶體驗。