在 Web 開發中，Ajax 技術是實現異步通訊的主要方式之一。通過使用 Ajax，我們能夠在不刷新網頁的情況下向服務器發送請求，并更新網頁上的部分內容。本文介紹了如何使用 Ajax 將動態內容輸出到 HTML 代碼中。

在 JavaScript 中，我們可以使用 XMLHttpRequest 對象來發送 Ajax 請求。其中，XMLHttpRequest 對象的 onreadystatechange 事件會在 Ajax 請求發生變化時被觸發。通過監聽 onreadystatechange，我們能夠捕捉到服務器返回的響應數據，并將其輸出到 HTML 代碼中。

function loadContent() {
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && xhr.status == 200) {
// 將響應數據輸出到 HTML 代碼中
document.getElementById("content").innerHTML = xhr.responseText;
}
};
xhr.open("GET", "content.php", true);
xhr.send();
}

上述代碼中，loadContent 函數會發送一個 GET 請求到 content.php，獲取服務器返回的響應數據。如果請求成功，onreadystatechange 事件會被觸發。在事件處理函數中，我們通過 document.getElementById() 方法找到需要更新的 HTML 元素，并使用 innerHTML 屬性將響應數據輸出到該元素中。

需要注意的是，XHR 請求是異步進行的。也就是說，當 XHR 發送請求時，代碼會繼續往下執行而不會等待響應數據的返回。因此，我們需要在事件處理函數中判斷 XHR 狀態來確保數據已經完全返回并能夠被正確地輸出到 HTML 代碼中。