作者： Jonathan Fenocchi
時(shí)間：2005.10.25
譯者：Sheneyan
英文原文：
http://webreference.com/programming/javascript/jf/column12/index.html
在過去，由于為了獲得新數(shù)據(jù)而不得不重新加載web頁面（或者加載其他頁面）導(dǎo)致web應(yīng)用程序發(fā)展被限制。雖然有其他方法可用（不加載其他頁面），但是這些技術(shù)都沒有被很好地支持而且有bug成災(zāi)的趨向。在過去的幾個(gè)月里，一個(gè)過去并不被廣泛支持的技術(shù)已經(jīng)被越來越多的web沖浪者（web surfers??是指瀏覽器還是瀏覽者？）所接受，它給了開發(fā)者更多的自由開發(fā)先進(jìn)的web應(yīng)用程序。這些通過javascript來異步取得xml數(shù)據(jù)的應(yīng)用程序，被親切的稱為“Ajax應(yīng)用程序”（Asynchronous Javascript and XML applications）。在這篇文章中，我將會(huì)解釋如何通過Ajax來取回一個(gè)遠(yuǎn)程的XML文件并更新一個(gè)web page，并且隨著這個(gè)系列的繼續(xù)，我將討論更多的方法，使用ajax技術(shù)將你的web應(yīng)用程序提升到一個(gè)新的層次.
這第一步就是創(chuàng)建一個(gè)帶一些數(shù)據(jù)的XML文件。我們將這個(gè)文件命名為data.xml。它是一個(gè)簡單的XML文件，而在一個(gè)真實(shí)的程序中，它會(huì)復(fù)雜許多，但對(duì)于我們的例子來說，簡單明了是最合適地。
<?xml version="1.0" encoding="UTF-8"?> <root> <data> 這是一些示例數(shù)據(jù)，它被保存在一個(gè)XML文件中，并被JavaScript取回。 </data> </root>
現(xiàn)在讓我們創(chuàng)建一個(gè)簡單的web頁面包含一些示例數(shù)據(jù)。這個(gè)頁面將是我們的js腳本所在，并且這個(gè)頁面將會(huì)讓用戶們?cè)L問柄看到Ajax腳本的運(yùn)行。我們把它命名為ajax.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="zh" dir="ltr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>使用ajax開發(fā)web應(yīng)用程序 - 示例</title>
</head>
<body>
<h1>使用ajax開發(fā)web應(yīng)用程序</h1>
<p>這個(gè)頁面演示了AJAX技術(shù)如何通過動(dòng)態(tài)讀取一個(gè)遠(yuǎn)程文件來更新一個(gè)網(wǎng)頁的內(nèi)容－－不需要任何網(wǎng)頁的重新加載。注意：這個(gè)例子對(duì)于禁止js的用戶來說沒有效果。</p>
<p id="xmlObj">
這是一些示例數(shù)據(jù)，它是這個(gè)網(wǎng)頁的默認(rèn)數(shù)據(jù) <a href="data.xml"
title="查看這個(gè)XML數(shù)據(jù)." onclick="ajaxRead('data.xml'); this.style.display='none'; return false">查看XML數(shù)據(jù).</a>
</p>
</body>
</html>
注意，對(duì)于那些沒有javascript的用戶，我們直接鏈接到data.xml文件。對(duì)于那些允許運(yùn)行javascript的用戶，函數(shù)“ajaxRead”將被運(yùn)行，這個(gè)鏈接被隱藏，并不會(huì)被轉(zhuǎn)向到那個(gè)data.xml文件。函數(shù)“ajaxRead”現(xiàn)在還沒定義。所以如果你要檢驗(yàn)上面的示例代碼，你會(huì)得到一個(gè)javascript錯(cuò)誤。讓我們繼續(xù)并定義這個(gè)函數(shù)（還有其他的），讓你能夠看到ajax是如何工作的，下面的腳本要放到你的head標(biāo)簽里：
新聞熱點(diǎn)
疑難解答
圖片精選
