AJAX（Asynchronous JavaScript and XML）是一種在網頁上實現異步通信的技術。通過AJAX，我們可以在不刷新整個頁面的情況下，向服務器發送請求并獲取響應數據。本文將介紹如何使用AJAX來實現按時間段查詢的功能。

假設我們有一個日志系統，用戶可以輸入開始時間和結束時間來查詢在該時間段內發生的日志。我們可以通過AJAX來實現實時查詢，用戶在輸入結束時間后，會立即展示符合條件的日志列表。

在HTML頁面中，我們可以使用表單來輸入開始時間和結束時間，并通過AJAX來發起請求。以下是一個簡單的表單示例：

<form>
<label for="start-date">開始時間：</label>
<input type="text" id="start-date" placeholder="YYYY-MM-DD">
<label for="end-date">結束時間：</label>
<input type="text" id="end-date" placeholder="YYYY-MM-DD">
<button type="button" onclick="searchLogs()">查詢</button>
</form>

在上述代碼中，我們創建了兩個輸入框，用戶可以在其中輸入開始時間和結束時間。點擊"查詢"按鈕時，會調用名為"searchLogs"的JavaScript函數。

接下來，我們需要編寫JavaScript函數來執行AJAX請求。以下是一個使用XMLHttpRequest對象發送AJAX請求的示例：

function searchLogs() {
var startDate = document.getElementById("start-date").value;
var endDate = document.getElementById("end-date").value;
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
if (xhr.readyState == XMLHttpRequest.DONE) {
if (xhr.status == 200) {
// 在這里處理響應數據
} else {
console.error("請求錯誤：" + xhr.status);
}
}
};
xhr.open("GET", "search.php?start_date=" + startDate + "&end_date=" + endDate, true);
xhr.send();
}

在上述代碼中，我們首先獲取用戶輸入的開始時間和結束時間。然后，創建一個XMLHttpRequest對象，并定義其onreadystatechange事件處理程序。當AJAX請求的狀態發生變化時，該函數會被調用。

在onreadystatechange事件處理程序中，我們首先檢查XMLHttpRequest對象的readyState屬性是否為XMLHttpRequest.DONE。這表明請求已完成。

接下來，我們檢查請求的狀態是否為200，這表示請求成功。如果請求成功，我們可以在這里處理響應數據。否則，我們打印一個錯誤消息。

最后，我們調用xhr.open方法來設置請求的方法（GET或POST）和URL。在這里，我們將開始時間和結束時間作為查詢字符串的一部分傳遞給服務器。然后，使用xhr.send方法來發送請求。

服務器端的代碼可以根據所使用的后端技術不同而有所不同。以下是一個使用PHP來處理AJAX請求的示例：

<?php
$startDate = $_GET["start_date"];
$endDate = $_GET["end_date"];
// 執行查詢并返回相關日志數據
// ...
?>

在這個例子中，我們通過$_GET超全局變量來獲取開始時間和結束時間。然后，我們可以執行相應的查詢并返回相關的日志數據。根據具體的需求和數據庫類型，查詢方式可能有所不同。

通過上述的HTML、JavaScript和服務器端代碼，我們可以實現按時間段查詢的功能。用戶在輸入開始時間和結束時間后，點擊"查詢"按鈕，便會進行AJAX請求，并展示相應的日志列表。

總結來說，AJAX是一種強大的技術，可以在不刷新整個頁面的情況下實現實時查詢等功能。通過合理運用AJAX，我們可以提升用戶體驗，并提供更加高效的交互。