現在，隨著互聯網技術的發展，越來越多的網站和應用程序開始使用Ajax技術來實現異步加載和交互。當我們瀏覽網頁時，有時會遇到需要從API接口獲取數據并展示的情況。本文將介紹如何使用Ajax接收API返回的圖片數據，并在網頁上顯示。

首先，我們需要確定要使用的API接口。以Unsplash API為例，它是一個提供高質量免費圖片的API接口。我們可以使用它來獲取圖片數據并展示在網頁上。

接下來，需要編寫一個Ajax請求的代碼，通過該請求向API接口發送請求，并獲取返回的數據。我們可以使用jQuery庫中的Ajax方法來實現：

$.ajax({
url: 'https://api.unsplash.com/photos/random',
method: 'GET',
data: {
client_id: 'your_client_id'
},
success: function(response){
// 在這里處理返回的數據
}
});

在上面的代碼中，我們指定了API接口的URL，并使用GET方法發送請求。在data屬性中，我們傳遞了一個客戶端ID，這是為了驗證我們的身份。當請求成功后，我們可以在success回調函數中處理返回的數據。

由于返回的數據中包含圖片的URL，我們可以使用JavaScript來動態創建一個元素，并將圖片URL賦給它的src屬性。通過將該元素添加到HTML頁面中的某個元素中，就可以實現在網頁上顯示圖片。

success: function(response){
var imageUrl = response.urls.regular;
var image = document.createElement('img');
image.src = imageUrl;
document.getElementById('image-container').appendChild(image);
}

在上面的代碼中，我們首先從返回的數據中獲取到了圖片的URL，然后使用JavaScript創建了一個元素，并將圖片URL賦給了它的src屬性。最后，我們通過getElementById方法獲取到了一個包含圖片的容器元素，并將元素添加到該容器中。

通過以上的代碼實現，我們就可以在網頁上顯示來自API接口的圖片了。當頁面加載完畢后，Ajax請求將會被發送到API接口，返回的圖片數據將會被處理并通過元素顯示在網頁上。

總之，通過使用Ajax技術，我們可以輕松地從API接口獲取數據，并在網頁上顯示。本文以Unsplash API為例，演示了如何使用Ajax接收API返回的圖片數據，并通過JavaScript將其顯示在網頁上。不過，我們需要注意合法使用API接口，并根據API的要求進行身份驗證。這樣我們就可以利用API接口提供的豐富的數據資源，為我們的網頁和應用程序增加更多的功能和交互性。