AJAX（異步 JavaScript 和 XML）是一種先進(jìn)的 Web 技術(shù)，它的實(shí)現(xiàn)方式是使網(wǎng)頁(yè)在不重新加載整個(gè)頁(yè)面的情況下，動(dòng)態(tài)地更新數(shù)據(jù)。使用 AJAX 技術(shù)可以實(shí)現(xiàn) web 頁(yè)面上的各種有趣的交互效果，比如，可以實(shí)現(xiàn)無(wú)需刷新整個(gè)頁(yè)面的表單驗(yàn)證，無(wú)需刷新整個(gè)頁(yè)面的即時(shí)搜索等。

而在實(shí)現(xiàn) AJAX 動(dòng)態(tài)加載 HTML 代碼的過程中，我們需要使用到 JavaScript 語(yǔ)言的一個(gè)重要特性——DOM（文檔對(duì)象模型）。DOM 可以把一個(gè) HTML 文檔看成一個(gè)樹形結(jié)構(gòu)，HTML 文檔中的每個(gè)元素都是一顆樹上的一個(gè)節(jié)點(diǎn)。使用 DOM，我們可以通過腳本語(yǔ)言修改、添加、刪除 HTML 文檔中的元素，從而實(shí)現(xiàn) AJAX 動(dòng)態(tài)加載 HTML 代碼的功能。

function loadPage(url) { // url為待加載的 HTML 文檔的 URL
var xhr = new XMLHttpRequest(); // 創(chuàng)建 XMLHttpRequest 對(duì)象
xhr.open('GET', url, true); // 設(shè)置請(qǐng)求方式和 URL
xhr.onreadystatechange = function() { // 添加事件監(jiān)聽器
if (xhr.readyState === 4 && xhr.status === 200) { // 判斷請(qǐng)求是否成功
var container = document.getElementById('container'); // 獲取用于裝載 HTML 代碼的容器元素
container.innerHTML = xhr.responseText; // 將請(qǐng)求到的 HTML 代碼注入容器元素中
}
};
xhr.send(); // 發(fā)送 AJAX 請(qǐng)求
}

以上就是最基本的 AJAX 動(dòng)態(tài)加載 HTML 代碼的 JavaScript 實(shí)現(xiàn)方式，可以應(yīng)用于需要實(shí)現(xiàn)動(dòng)態(tài)伸縮的網(wǎng)頁(yè)模塊或子模塊中，實(shí)現(xiàn)頁(yè)面局部的優(yōu)美跳轉(zhuǎn)和無(wú)縫銜接。