AJAX（Asynchronous JavaScript and XML）是一種在網頁中實現異步通信的技術，可以無需刷新整個頁面而更新局部內容。通常情況下，我們使用AJAX來請求服務器返回JSON或XML格式的數據。但是，在某些特定情況下，我們需要直接請求JSP頁面，以便獲取其中的HTML代碼用于更新頁面。這篇文章將介紹如何使用AJAX直接請求JSP頁面并獲取結果。

假設我們有一個在線商城網站，其中有一個商品分類的JSP頁面，我們希望在用戶選擇不同商品分類時，動態加載該分類下的所有商品。傳統的做法是使用表單提交或超鏈接跳轉到另一個頁面，然后服務器返回該分類下的所有商品。但是這種方式會導致整個頁面刷新，用戶體驗不好。為了提升用戶體驗，我們可以使用AJAX來動態加載商品數據。

下面是一個簡單的示例，演示了如何使用AJAX直接請求JSP頁面，并獲取其中的HTML代碼：

// JavaScript代碼
function loadProducts(category) {
var request = new XMLHttpRequest();
request.onreadystatechange = function() {
if (this.readyState === 4 && this.status === 200) {
var response = this.responseText;
document.getElementById("product-list").innerHTML = response;
}
};
request.open("GET", "category.jsp?category=" + category, true);
request.send();
}

在上面的示例中，我們定義了一個名為loadProducts的JavaScript函數。該函數接受一個參數category，表示商品分類。通過調用XMLHttpRequest對象的open方法，我們指定請求的URL為category.jsp，并在URL中附帶查詢參數category，用于傳遞商品分類信息。然后，我們調用send方法發送AJAX請求。

在category.jsp頁面中，我們可以根據傳入的商品分類參數，從數據庫或其他數據源中查詢商品數據，并將其渲染為HTML代碼返回給AJAX請求。下面是一個簡單的示例：

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ page import="java.util.List" %>
<%@ page import="com.example.Product" %>
<%
String category = request.getParameter("category");
// 根據category查詢商品數據
List<Product> productList = ProductService.getProductsByCategory(category);
%>
<%
for (Product product : productList) {
%>
<div class="product">
<img src="<%= product.getImageUrl() %>">
<h2><%= product.getName() %></h2>
<p><%= product.getDescription() %></p>
</div>
<%
}
%>

在上面的JSP代碼中，我們首先通過request.getParameter方法獲取傳入的商品分類參數。然后，我們使用ProductService類的getProductsByCategory方法查詢該分類下的所有商品。最后，我們使用一個簡單的循環將每個商品渲染為一個HTML代碼塊，并返回給AJAX請求。

通過上述示例，我們可以實現在用戶選擇不同商品分類時，動態加載該分類下的所有商品，而無需刷新整個頁面。這大大提升了用戶體驗，使用戶能夠更流暢地瀏覽商品。

總結來說，使用AJAX直接請求JSP頁面可以幫助我們實現動態加載頁面內容，提升用戶體驗。無論是在在線商城網站還是其他類型的網站中，這種技術都能發揮巨大的作用。希望本文對你理解和應用AJAX直接請求JSP頁面有所幫助。