Ajax是什么
我理解Ajax 是一种异步请求数据的一种技术，对于改善用户的体验和程序的性能很有帮助。
Ajax的使用
(1)创建`XMLHttpRequest`对象,也就是创建一个异步调用对象.
(2)创建一个新的`HTTP`请求,并指定该`HTTP`请求的方法、`URL`及验证信息.
(3)设置响应`HTTP`请求状态变化的函数.
(4)发送`HTTP`请求.
(5)获取异步调用返回的数据.
(6)使用JavaScript和DOM实现局部刷新.
var xmlhttp = new XMLHttpRequest();
xmlHttp.open('get','demo.php','true');
xmlHttp.send();
xmlHttp.onreadystatechange()=>{
if(xmlHttp.readyState === 4 && xmlHttp.status === 2000){
}
}
以下步骤，如果不能理解你死记硬背都要记下来，总比你答不出来要好吧！
1.创建Ajax核心对象XMLHttpRequest
var xmlhttp;
if(window.XMLHttpRequest){
//IE7+,Chrome,Firefox,Safari,Opera执行此代码 xmlhttp=new XMLHttpRequest;
}else{
//IE5,IE6执行该代码
xmlhttp=newActiveXObject("Microsoft.XMLHTTP");
}
2.向服务器发送请求
xmlhttp.open(method,url,async);
xmlhttp.send();
示例如下：
xmlhttp.open("GET","http://www.runoob.com/try/ajax/demo_get.php",true);
xmlhttp.send();
注意一：open 的参数要牢记，很多面试官爱问这样的细节
-method：请求的类型；GET 或 POST
-url：文件在服务器上的位置，相对位置或绝对位置
-async：true（异步）或 false（同步）
-为什么使用 Async=true ？
我们的实例在 open() 的第三个参数中使用了 "true"。
该参数规定请求是否异步处理。
True 表示脚本会在 send() 方法之后继续执行，而不等待来自服务器的响应。
onreadystatechange 事件使代码复杂化了。但是这是在没有得到服务器响应的情况下，防止代码停止的最安全的方法。
通过把该参数设置为 "false"，可以省去额外的 onreadystatechange 代码。如果在请求失败时是否执行其余的代码无关紧要，那么可以使用这个参数
注意二：post请求不同于get请求
send(string)方法post请求时才使用字符串参数，否则不用带参数。
注意三：post请求一定要设置请求头的格式内容
xmlhttp.open("POST","ajax_test.html",true);
xmlhttp.setRequestHeader("content-type","application/x-www-form-urlencoded");
xmlhttp.send("fname=Herry&lname=Ford");
3.服务器响应处理
responseText 获得字符串形式的响应数据。
responseXML 获得XML 形式的响应数据。
3.1 同步处理
xmlhttp.open("GET","http://www.runoob.com/try/ajax/demo_get.php",false);
xmlhttp.send();
document.getElementById("mydiv").innerHTML=xmlhttp.responseText;
直接在send()后面处理返回来的数据。
3.2 异步处理
异步处理相对比较麻烦，要在请求状态改变事件中处理。
xmlhttp.onreadystatechange=function(){//接收到服务端响应时触发
if(xmlhttp.readyState==4&&xmlhttp.status==200){
document.getElementById("mydiv").innerHTML=xmlhttp.responseText;
}
}
一共有5中请求状态，从0 到 4 发生变化。
0: 请求未初始化
1: 服务器连接已建立
2: 请求已接收
3: 请求处理中
4: 请求已完成，且响应已就绪
xmlhttp.status：响应状态码。这个也是面试比较爱问的，这个必须知道4个以上，比较常见的有：
200: "OK"
304：该资源在上次请求之后没有任何修改（这通常用于浏览器的缓存机制，使用GET请求时尤其需要注意）。
403 （禁止） 服务器拒绝请求。
404 （未找到） 服务器找不到请求的网页。
408 （请求超时） 服务器等候请求时发生超时。
500 （服务器内部错误） 服务器遇到错误，无法完成请求。
网友评论