AJAX是一種強(qiáng)大的技術(shù)，可以通過發(fā)送異步HTTP請求來更新網(wǎng)頁的部分內(nèi)容而不必刷新整個頁面。然而，有時候我們也需要獲取HTTP響應(yīng)的頭信息，以便進(jìn)行進(jìn)一步的處理。本文將介紹如何使用AJAX獲取HTTP響應(yīng)頭，并通過舉例來說明其應(yīng)用。

假設(shè)我們正在使用AJAX發(fā)送一個異步請求來獲取一篇博客文章的內(nèi)容。我們希望獲取文章的最后更新時間，以便在頁面上顯示。為了實現(xiàn)這個目標(biāo)，我們可以使用AJAX的XMLHttpRequest對象來發(fā)送異步請求，并通過getResponseHeader()方法獲取HTTP響應(yīng)頭中的Last-Modified字段。

var xhr = new XMLHttpRequest();
xhr.open('GET', 'https://www.example.com/blog/article', true);
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
var lastModified = xhr.getResponseHeader('Last-Modified');
document.getElementById('last-modified').innerHTML = 'Last Modified: ' + lastModified;
}
};
xhr.send();

在上面的代碼中，我們首先創(chuàng)建了一個XMLHttpRequest對象，并使用open()方法指定了請求的方法、URL和是否異步。然后，我們定義了一個onreadystatechange事件處理函數(shù)，該函數(shù)在AJAX的狀態(tài)發(fā)生變化時被調(diào)用。當(dāng)readystate為4（請求已完成）且status為200（成功）時，我們通過getResponseHeader()方法獲取到了Last-Modified字段的值，并將其顯示在頁面上。

除了getLastModified字段外，我們還可以獲取其他常見的HTTP響應(yīng)頭字段，例如Content-Type和Content-Length。例如，假設(shè)我們正在開發(fā)一個文件上傳的功能，我們可以通過獲取響應(yīng)頭中的Content-Length字段來顯示上傳文件的大小。

var xhr = new XMLHttpRequest();
xhr.open('POST', 'https://www.example.com/upload', true);
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
var fileSize = xhr.getResponseHeader('Content-Length');
document.getElementById('file-size').innerHTML = 'File Size: ' + fileSize + ' bytes';
}
};
xhr.send(formData);

在上面的代碼中，我們通過POST方法將文件上傳到服務(wù)器，并通過getResponseHeader()方法獲取了響應(yīng)頭中的Content-Length字段，然后將文件大小顯示在頁面上。

需要注意的是，有些HTTP響應(yīng)頭字段可能不被瀏覽器允許讀取，例如Set-Cookie字段。這是出于安全考慮，防止惡意腳本獲取用戶的敏感信息。因此，在使用AJAX獲取HTTP響應(yīng)頭時，我們需要確保所需的字段是可以被讀取的。

綜上所述，通過使用AJAX獲取HTTP響應(yīng)頭，我們能夠在異步請求中獲取到關(guān)鍵的HTTP信息，并在頁面上進(jìn)行進(jìn)一步處理。無論是顯示最后更新時間還是上傳文件的大小，AJAX與HTTP響應(yīng)頭的結(jié)合使得我們可以更加靈活和強(qiáng)大地處理網(wǎng)站的數(shù)據(jù)。