创建ajax步骤:创建ajax对象、连接到服务器、发送请求、接收返回值。实例如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>my ajax</title>
<script type="text/javascript">
window.onload = function(){
var oBtn = document.getElementById('btn1');
oBtn.onclick = function(){
//1.创建一个ajax对象
var oAjax = new XMLHttpRequest();
//2.连接服务器
//open(方法,文件名,异步传输)
oAjax.open('GET','abc.txt?t='+new Date().getTime(),true); //?去缓存
//3.发送请求
oAjax.send();
//4.接收返回信息
oAjax.onreadystatechange = function(){
/*readyState =
0 (未初始化)还没有调用open()方法
1 (载入)已调用send()方法,正在发送请求
2 (载入完成)send()方法完成,已收到全部响应内容
3 (解析)正在解析响应内容
4 (完成)响应内容解析完成,可以在客户端调用了
*/
if(oAjax.readyState==4) //读取完成
{
if(oAjax.status == 200) //status表示请求结果,200表示读取成功,除了200基本都是失败
{
alert("success:"+oAjax.responseText);
}
else{
alert("failed:"+oAjax.status);
}
}
};
};
};
</script>
</head>
<body>
<input id="btn1" type="button" value="按钮"></input>
</body>
</html>
注意:该例程需要在本地服务器上运行,不然无法使用ajax。