Ajax是一種網頁開發技術，它使得網頁能夠實現無需重新加載的數據交互。這種技術可以在整個頁面中被使用，并且還可以在新窗體中以提供更豐富的用戶體驗。無論是在整個頁面還是在新窗體中，Ajax都能夠有效地處理數據請求和響應，減少了頁面重載的需求，并能夠提供即時的反饋。下面我們將通過一些例子來詳細討論Ajax在整個頁面和新窗體中的使用方式。 在整個頁面中，Ajax可以幫助我們在不刷新整個頁面的情況下，獲取和顯示數據。比如一個新聞網站，當用戶瀏覽頁面并點擊某個新聞的標題時，網頁可以通過Ajax來請求后臺獲取相關的新聞內容，并將其實時地展示在當前頁面上，而不需要重新加載整個頁面。下面是一個使用Ajax在整個頁面中獲取新聞內容的示例：

<script>
function getNewsContent(newsId) {
$.ajax({
url: "news.php",
method: "GET",
data: {id: newsId},
success: function(response) {
// 將獲取到的新聞內容顯示在頁面上
$("#newsContent").html(response);
},
error: function(err) {
// 處理錯誤情況
console.log(err);
}
});
}
// 用戶點擊新聞標題時觸發獲取新聞內容的函數
$(".newsTitle").click(function() {
var newsId = $(this).attr("data-id");
getNewsContent(newsId);
});
</script>

在上面的示例中，當用戶點擊新聞標題時，通過Ajax來請求新聞的內容。成功獲取到內容后，通過jQuery的html()函數將新聞內容填充到頁面指定的元素（id為"newsContent"）中。這樣，用戶就能夠在不刷新頁面的情況下即時看到新聞的內容。 除了在整個頁面中使用Ajax，它也可以在新窗體中以提供更好的交互體驗。舉個例子，假設我們有一個電子商務網站，網頁上顯示了一個商品列表。當用戶點擊某個商品的圖片時，我們想要在新窗體中展示該商品的詳細信息。這時，我們可以使用Ajax來請求后臺獲取商品信息，并通過新窗體展示。下面是一個在新窗體中使用Ajax展示商品信息的示例：

$(".productImage").click(function() {
var productId = $(this).attr("data-id");
$.ajax({
url: "product.php",
method: "GET",
data: {id: productId},
success: function(response) {
// 創建新窗體
var newWindow = window.open("", "Product Details", "width=500,height=500");
// 將獲取到的商品信息顯示在新窗體中
newWindow.document.write(response);
newWindow.document.close();
},
error: function(err) {
// 處理錯誤情況
console.log(err);
}
});
});

在上面的示例中，當用戶點擊商品圖片時，通過Ajax請求獲取商品的詳細信息。成功獲取到信息后，創建一個新窗體，并將獲取到的商品信息寫入新窗體中。這樣，用戶就能夠在一個新窗體中看到有關該商品的更多詳細信息。 總結來說，無論是在整個頁面中還是在新窗體中，Ajax技術都可以用來實現數據交互。通過Ajax，我們可以實現無需重新加載頁面的數據加載和展示，提供更好的用戶體驗。無論是在一個新聞網站上獲取新聞內容，還是在一個電子商務網站上展示商品信息，Ajax都是非常有用的工具。通過合理運用Ajax，我們可以使網頁的交互更加便捷和高效。