在开始编写Javascript前，我们先用PHP制作一个简单请求对象，它将接受XMLHTTP的GET数据，然后回复一段字串。

<?php


$name="";$email="";

if(isset($_GET['name']) && isset($_GET['email'])){
$name = $_GET['name'];
$email = $_GET['email'];
if(eregi("^[a-z0-9_]+@[a-z0-9_.]+$",$email) && $name){
echo "Thank you, ".$name." .Your email is ".$email;
}else{
echo "You're not complete the form or the format of Email is invalid.";
}
}
?>

以上的对象操作很简单，纯粹是显示用户的名字和电邮而以。如果用户没有输入，则会发出通告。

接下来就是利用Javascript的时候了。我们首先要做的就是先生成一个XMLHttpRequest物件，不过微软则是生成一个Msxml2的XMLHTTP的ActiveX物件；虽然两个浏览器的物件不同，不过其他的功能都大同小异，接下来的原码就没有什么不同了。

//先创建一个主函式，所有的起始工作都放在这里。
function loadXML(url){

/*一般上Netscape/FireFox会先检查浏览器的使用权限，如果你的程序不是在本地而是在别的网络空间运作的话，你需要给于浏览器一个Privilage，要不然会有Permission Denied的错误释出。
（我将这个当作comment，因为目前这个程序是在本地测试，不需要这一步骤）*/

/*if(window.netscape && netscape.security){
netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead");
}*/

//检查浏览器种类，并生成适合该浏览器的XMLHTTP物件
if(navigator.appName == "Netscape"){
xmlhttp = new XMLHttpRequest();
}else if(navigator.appName == "Microsoft Internet Explorer"){
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
}catch(e){
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
}else{
return false;
}

/*name和email是两个textbox的值，也就是用户所呈交的数据。搜集了这两个数据之后，把它们和url
//连接在一起，并用GET的方法准备传送给处理对象。 */
if(document.getElementById){
var name = document.getElementById("txt_name").value;
var email = document.getElementById("txt_email").value;
url += "?name="+name+"&email="+email;
}

/*XMLHttpRequest在和服务器交换资料是会有4个阶段，我们可以通过readyState这个特性来
//得知交换资料是否成功。而每个readyState变换的时候都会有一个Event Handler来负责产生
//Event。以下我们将每一个event交给processdata来处理。processdata是一个处理服务器回复的
//方法。*/
try {
xmlhttp.onreadystatechange = processdata;

/*open是将指令传输到服务器的方法，一共有三个parameter，第一个是HTTP的GET指令；第二个是请求对象
//的位址；第三个是同步和非同步的选项，true为非同步。
//send是将请求资料送出的方法，在这个例子里我们已经用GET的方式将资料放入url文档里，所以在这里
//只需呼叫send就可以了。（注：Netscape需要加入一个null的parameter）.*/

xmlhttp.open("GET",url,true);
(navigator.appName == "Netscape")? xmlhttp.send(null):xmlhttp.send();
}catch(e){
return false;
}
return true;
}

以下是processdata方法的源码，正如之前所说的，当readyState为4的时候，就代表资料已经准备好了，这时候的状态(status)为200。当readyState为0-3的时候我们可以显示一个Loading字眼，待料资料还在准备中，这个在大部分的AJAX界面都可以看到。资料准备就绪时，我们可以透过responseText来提取纯文档资料，或responseXML来提取XML格式的资料（只限XML文件）。

function processdata(){
/*if(window.netscape && netscape.security){
netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead");
}*/

var para1 = document.getElementById("para1");
(para1.hasChildNodes())?para1.removeChild(para1.firstChild):{};

if(xmlhttp.readyState == 4){
if(xmlhttp.status == 200){
var result = xmlhttp.responseText;
var newResult = document.createTextNode(result);
para1.appendChild(newResult);
}
}else{
var newTxt = document.createTextNode("Loading...");
para1.appendChild(newTxt);
}
}

appendChild和createTextNode等为DOM的函式，之前在我的博客里曾经讨论过，所以我这里不多做介绍。XMLHttpRequest的用法并不复杂，可以说是很简单；不过，最重要的还是处理XML文件的能力，因为在真正运用时，XML还是传输资料的首选，而且伸缩性也相当大。比较起来，纯文档只能用来显示一些简单的句子，不能够用来表示有结构性的数据组。

由于XMLHttpRequest对第三网域（用户与服务器之外的网域）是有一个限制的。就好像用户不能从www.google.com透过XMLHttpRequest向www.microsoft.com发出请求，否则open方法将会释出Permission Denied的错误，这个对很多人来说都是一个困扰。下一个部分，我将解释如何考工具突破这个限制，让XMLHttpRequest能够发挥其真正的潜力。

这个是以上例子的展示 http://kfchai.6te.net/ajax

待续....