Ajax（Asynchronous JavaScript and XML）是一種使用網頁瀏覽器內置的 XMLHttpRequest 對象與服務器進行異步通信的技術。通過使用 Ajax，網頁可以在不刷新整個頁面的情況下，實現與服務器的數據交互和更新。

在父頁面中，我們可以使用 Ajax 回調函數來獲取文章的內容。回調函數是一種在異步操作完成后執行的函數，用于處理操作的結果。通過使用回調函數，我們可以在獲取到文章內容后，將其顯示在父頁面上。

接下來，讓我們來看一個簡單的示例。假設我們有一個父頁面和一個子頁面。子頁面中有一個文本框用于輸入文章的 URL。當用戶點擊子頁面中的按鈕時，子頁面會發送 Ajax 請求到服務器，并將獲取到的文章內容返回給父頁面。

function getArticleContent(url, callback) {
// 創建 XMLHttpRequest 對象
var xhr = new XMLHttpRequest();
// 綁定 readyStateChange 事件
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
// 獲取到文章內容后，調用回調函數
callback(xhr.responseText);
}
};
// 發送 Ajax 請求
xhr.open('GET', url, true);
xhr.send();
}
// 子頁面中的按鈕點擊事件處理函數
function onButtonClick() {
var url = document.getElementById('article-url').value;
// 調用 getArticleContent 函數，并傳入回調函數
getArticleContent(url, function(content) {
// 將獲取到的文章內容顯示在父頁面中
window.opener.displayArticleContent(content);
// 關閉子頁面
window.close();
});
}

在上面的代碼中，我們首先定義了一個函數getArticleContent用于發送 Ajax 請求并獲取文章內容。在函數中，我們創建了一個 XMLHttpRequest 對象，并通過open方法指定請求方法和 URL，再通過send方法發送請求。在onreadystatechange事件處理函數中，我們檢查 readyState 和 status 是否滿足條件，滿足條件后調用回調函數，并將獲取到的文章內容作為參數傳入回調函數中。

在子頁面中，我們定義了一個按鈕點擊事件處理函數onButtonClick，該函數會從文本框中獲取文章的 URL，并調用getArticleContent函數來獲取文章內容。在調用getArticleContent函數時，我們傳入了一個匿名函數作為回調函數。在這個匿名函數中，我們調用了父頁面中的一個名為displayArticleContent的函數，并將獲取到的文章內容作為參數傳入該函數中。最后，我們通過window.close方法關閉了子頁面。

在父頁面中，我們需要定義一個名為displayArticleContent的函數，用于接收子頁面傳來的文章內容，并將其顯示在父頁面中。

// 父頁面中的函數用于顯示文章內容
function displayArticleContent(content) {
var articleContainer = document.getElementById('article-container');
articleContainer.innerHTML = content;
}

在上面的代碼中，我們通過getElementById方法獲取了父頁面中用來顯示文章內容的容器元素，并通過innerHTML屬性將獲取到的文章內容設置為容器元素的 HTML 內容。

通過使用 Ajax 回調函數，我們可以方便地從子頁面獲取文章內容，并將其顯示在父頁面中。這樣的設計不僅提高了用戶體驗，還使得我們可以減少對整個頁面的刷新，提高了網頁的性能。