AJAX，全稱為Asynchronous JavaScript and XML，即使用JavaScript進行異步的XML數據交互技術。通過AJAX，網頁可以實現在不重新加載整個頁面的情況下，向服務器請求數據并將返回的數據進行展示。這種技術的應用非常廣泛，尤其在Web開發中，經常用于實現局部刷新、異步加載和數據交互等功能。本文將介紹AJAX發起HTTP請求的原理和方法，并通過詳細的舉例來說明其應用。

在使用AJAX發起HTTP請求時，常使用的是XMLHttpRequest對象。通過該對象創建一個HTTP請求，并在請求完成后通過回調函數進行處理。以下是一個簡單的例子：

var xhr = new XMLHttpRequest(); // 創建XMLHttpRequest對象
xhr.onreadystatechange = function() { // 狀態改變時的回調函數
if (xhr.readyState === 4 && xhr.status === 200) { // 請求完成并成功返回數據
var data = JSON.parse(xhr.responseText); // 解析返回的JSON數據
// 處理返回的數據
}
};
xhr.open('GET', 'example.php', true); // 發起GET請求，example.php為目標URL
xhr.send(); // 發送請求

上述代碼中，首先創建了一個XMLHttpRequest對象xhr，并通過其onreadystatechange屬性指定了一個回調函數。在回調函數中，首先判斷xhr的readyState屬性是否為4，表示請求已完成，并且通過xhr.status屬性判斷請求是否成功。如果請求成功，可通過xhr.responseText屬性獲取返回的文本數據。

在實際開發中，除了發起GET請求外，還常常需要發起POST請求來向服務器提交數據。以下是一個發起POST請求的例子：

var xhr = new XMLHttpRequest(); // 創建XMLHttpRequest對象
xhr.onreadystatechange = function() { // 狀態改變時的回調函數
if (xhr.readyState === 4 && xhr.status === 200) { // 請求完成并成功返回數據
alert('提交成功！');
}
};
xhr.open('POST', 'example.php', true); // 發起POST請求，example.php為目標URL
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); // 設置請求header
xhr.send('name=John&age=25'); // 發送請求，提交數據

上述代碼中，在發送POST請求前使用xhr.setRequestHeader方法設置請求的Content-Type頭，以指定請求的內容類型為application/x-www-form-urlencoded，并通過xhr.send方法提交數據。在服務器端，可通過解析請求的參數來獲取提交的數據。

除了使用原生的XMLHttpRequest對象外，也可以使用第三方庫如jQuery中封裝的ajax方法來簡化操作。以下是使用jQuery庫發起GET請求的例子：

$.ajax({
url: 'example.php', // 目標URL
type: 'GET', // 請求類型為GET
success: function(data) { // 請求成功的回調函數
// 處理返回的數據
},
error: function() { // 請求失敗的回調函數
// 處理錯誤
}
});

上述代碼中，使用$.ajax方法發起GET請求，并通過success參數指定請求成功時的處理函數，通過error參數指定請求失敗時的處理函數。在處理函數中，可以進一步對返回的數據進行處理，或者處理請求失敗的情況。

綜上所述，AJAX發起HTTP請求是實現網頁異步加載和數據交互的重要手段之一。無論是通過原生的XMLHttpRequest對象，還是通過庫如jQuery的封裝方法，都可以實現便捷高效的HTTP請求。通過舉例說明了使用AJAX發起GET請求和POST請求的基本方法，希望能對讀者理解和使用AJAX有所幫助。