- 创建Ajax核心对象XMLHttpRequest
var xmlhttp;
var xmlhttp;
if (window.XMLHttpRequest) {
// 兼容 IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
} else {
// 兼容 IE6, IE5
xmlhttp=newActiveXObject("Microsoft.XMLHTTP");
}
- 向服务器发送请求
xmlhttp.open(method,url,async);
send(string)
open的参数:
method: 请求的类型: GET或POST
url: 文件在服务器上的位置
async: true(异步)false(同步)
send(string)方法post请求时才使用字符串参数,否则不用带参数。
注意:post请求一定要设置请求头的格式内容
xmlhttp.open("POST","ajax_test.html",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("fname=Henry&lname=Ford");
3.服务器响应处理
responseText 获得字符串形式的响应数据。
responseXML 获得XML 形式的响应数据。
3.1 同步处理
xmlhttp.open("GET","ajax_info.txt",false);
xmlhttp.send();
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
3.2异步处理
异步处理相对比较麻烦,要在请求状态改变事件中处理。
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4 &&xmlhttp.status==200){
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.readyState一共有5种请求状态,从0到4发生变化
0: 请求未初始化
1: 服务器连接已建立
2: 请求已接收
3: 请求处理中
4: 请求已完成,且响应已就绪
xmlhttp.status:响应状态码。这个也是面试比较爱问的,这个必须知道4个以上,比较常见的有:
200: "OK"
403 (禁止) 服务器拒绝请求。
404 (未找到) 服务器找不到请求的网页。
408 (请求超时) 服务器等候请求时发生超时。
500 (服务器内部错误) 服务器遇到错误,无法完成请求。