javascript 实现ajax

AJAX 英文名称 Asynchronous JavaScript and XML即异步的 JavaScript 和 XML
AJAX 是与服务器交换数据并更新部分网页一门无刷新技术
构建自己的ajax 函数实现网页的无刷新数据交互
ajax的基础对象 XMLHttpRequest 对象 ，我们可以通过此对象与服务器交换数据
现代浏览器（IE7+、Firefox、Chrome、Safari 以及 Opera）均内建 XMLHttpRequest 对象。注意IE5 和 IE6 使用 ActiveXObject 因此当我们构建

XMLHttpRequest 的示例对象时我们需要验证当前浏览器支持的版本

XMLHttpRequest 主要函数方法和属性

向服务器发送请求open(method,url,async)
method:向服务器请求数据方式 get或 post
url :请求的文件url路径
async：向服务器发送请求的类型true（异步）或 false（同步）
注意当使用 async=true 时，则需在 onreadystatechange 事件中的根据请求执行状态完成需要的操作：（同步时在send（） 后面获取数据操作即可）
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
//请求文本成功时的操作
}
}

请求头信息设置：
setRequestHeader(header,value) 向请求添加 http 头。header: 规定头的名称 value: 规定头的值
如：xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
请求发送到服务器：
send(string) 当采用get方式时调用的函数为send（），当采用post方式时调用函数send（string）

对于 web 开发人员来说，发送异步请求是一个巨大的进步。很多在服务器执行的任务都相当费时。AJAX 出现之前，这可能会引起应用程序挂起或停止。
通过 AJAX，JavaScript 无需等待服务器的响应，而是：
在等待服务器响应时执行其他脚本
当响应就绪后对响应进行处理
请记住，JavaScript 会等到服务器响应就绪才继续执行。如果服务器繁忙或缓慢，应用程序会挂起或停止。
注释：当您使用 async=false 时，请不要编写 onreadystatechange 函数 - 把代码放到 send() 语句后面即可：

服务器响应：
服务器返回文本我们可以用 XMLHttpRequest 对象的 responseText 或 responseXML 属性。

responseText 获得字符串形式的响应数据。
responseXML 获得 XML 形式的响应数据。

onreadystatechange 事件
当请求被发送到服务器后，服务器会执行一些基于响应的任务。
每当 readyState 改变时，就会触发 onreadystatechange 事件。
readyState 属性存储 XMLHttpRequest 的状态信息。
readyState 存有 XMLHttpRequest 的状态
0: 请求未初始化
1: 服务器连接已建立
2: 请求已接收
3: 请求处理中
4: 请求已完成，且响应已就绪
status： 服务器执行结果 200: "OK"

示例源代码：
<script type="text/javascript">
var xmlhttp = null;
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
}
else {
xmlht = new ActiveXObject("Microsoft.XMLHTTP");
}
var xml = "";
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
xml = xmlhttp.responseText;
if (xml == "") {
xml = "null";
}
alert(xmlhttp.responseText);
$("#div").html(xml);
}
};
xmlhttp.open("get", "WebForm1.aspx", true);
xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlhttp.send("name=sanmao&age=20");

</script>