Javascript是一種常用的腳本語言，可以在網(wǎng)頁上實現(xiàn)動態(tài)交互效果。其中，Ajax是Javascript中的一種技術(shù)，也是一種在Web應用中創(chuàng)建快速動態(tài)交互的技術(shù)。它是Asynchronous Javascript And XML的縮寫，主要通過在不刷新整個頁面的情況下從服務器請求數(shù)據(jù)并更新部分網(wǎng)頁來實現(xiàn)。
Ajax主要通過XMLHttpRequest對象來實現(xiàn)從服務器請求數(shù)據(jù)，然后把返回的數(shù)據(jù)放到網(wǎng)頁的指定位置。下面是一個簡單的例子：
var xmlhttp;
if (window.XMLHttpRequest) {
// code for modern browsers
xmlhttp = new XMLHttpRequest();
} else {
// code for old IE browsers
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("demo").innerHTML = this.responseText;
}
};
xmlhttp.open("GET", "ajax_info.txt", true);
xmlhttp.send();在上面的代碼中，我們首先判斷瀏覽器是否支持XMLHttpRequest對象，然后創(chuàng)建一個XMLHttpRequest對象。當請求狀態(tài)改變時，我們檢查請求是否完成（readyState == 4）以及狀態(tài)是否為200（status == 200），如果是，我們就將返回的數(shù)據(jù)放到id為demo的元素中。
在Ajax中，XML被廣泛用于傳輸數(shù)據(jù)。XML格式是一種用于存儲和傳輸數(shù)據(jù)的標準格式，它有助于在不同的平臺和編程語言之間傳輸數(shù)據(jù)。下面是一個簡單的XML文檔：
<?xml version="1.0" encoding="UTF-8"?> <note> <to>Tove</to> <from>Jani</from> <heading>Reminder</heading> <body>Don't forget me this weekend!</body> </note>
以上的XML文檔包含一個note元素，包含四個子元素：to、from、heading和body。
在Ajax中，我們可以使用XMLHttpRequest對象來發(fā)送一個XML請求。下面是一個簡單的例子：
var xmlhttp;
if (window.XMLHttpRequest) {
// code for modern browsers
xmlhttp = new XMLHttpRequest();
} else {
// code for old IE browsers
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
var xmlDoc = this.responseXML;
document.getElementById("demo").innerHTML =
xmlDoc.getElementsByTagName("heading")[0].childNodes[0].nodeValue;
}
};
xmlhttp.open("GET", "note.xml", true);
xmlhttp.send();在這個例子中，我們發(fā)送了一個XML請求并將返回的XML數(shù)據(jù)放到變量xmlDoc中。然后，我們通過getElementsByTagName方法獲取heading元素，再通過childNodes[0]獲取節(jié)點的文本內(nèi)容，最后將文本內(nèi)容放到id為demo的元素中。
總之，Ajax技術(shù)的出現(xiàn)讓前端開發(fā)更加靈活和便捷。通過XMLHttpRequest對象，我們可以用Javascript從服務器請求數(shù)據(jù)，并將返回的數(shù)據(jù)動態(tài)地展示在網(wǎng)頁上。