為了幫助您理解 AJAX 的工作原理,我們創(chuàng)建了一個小型的 AJAX 應(yīng)用程序:
上面的 AJAX 應(yīng)用程序包含一個 div 和一個按鈕。
div 部分用于顯示來自服務(wù)器的信息。當(dāng)按鈕被點(diǎn)擊時,它負(fù)責(zé)調(diào)用名為 loadXMLDoc() 的函數(shù):
<!DOCTYPE html>
<html> <body>
<div id="myDiv"><h2>Let AJAX change this text</h2></div>
<button type="button" onclick="loadXMLDoc()">Change Content</button>
</body>
</html>
接下來,在頁面的 head 部分添加一個 <script> 標(biāo)簽。該標(biāo)簽中包含了這個 loadXMLDoc() 函數(shù):
<head>
<script>
function loadXMLDoc()
{
.... AJAX script goes here ...
}
</script>
</head>
要創(chuàng)建AJAX實(shí)例,需要使用服務(wù)器端語言,例如Servlet,JSP,PHP,的ASP.Net等,這里我們使用JSP來說一下。
創(chuàng)建AJAX的實(shí)例步驟:
在嘗試AJAX示例時,沒有不連續(xù)性并且您可以非??焖俚孬@得響應(yīng),但是當(dāng)您嘗試標(biāo)準(zhǔn)GCI示例時,您將不得不等待響應(yīng)并且您的頁面也會得到刷新。
在接下來的章節(jié)中,我們將會繼續(xù)為您講解AJAX的工作原理。
更多建議: