ajax
AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)。
AJAX 是一种用于创建快速动态网页的技术。
通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。
传统的网页(不使用 AJAX)如果需要更新内容,必需重载整个网页面。
有很多使用 AJAX 的应用程序案例:新浪微博、Google 地图、开心网等等。
优点:
(1)节省用户操作时间,提高用户体验,减少数据请求
(2)传输获取数据
AJAX唯一要做的就是:数据交互
特点:
通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新
完整AJAX基础过程:
步骤:
(1)创建ajax对象
(2)调用open()方法,启动请求
(3)调用send()方法,发送请求
(4)等待服务器,返回内容
var xhr;
if(window.XMLHttpRequest){//ie7以上支持
xhr= new XMLHttpRequest()
}else if(window.ActiveXObject){//只有ie6支持
xhr=new ActiveXObject(Microsoft.XMLHTTP)
}
xhr.onreadystatechange=function(){
// console.log(xhr.readyState,xhr.status)
//xhr.status服务器状态码
if(xhr.readyState==4&&xhr.status==200){
console.log("请求成功")
var jsons=xhr.responseText
//把字符串转为json数据
console.log(JSON.parse(jsons))
data=JSON.parse(jsons);
}
}
//启动请求:可传入三个参数
//1是字符串,值为get或post,表示请求方式
//2是请求地址
//3是布尔值,默认true表示异步,false
xhr.open("get","sor.php")
//发送请求
//可以传入参数,表示发送的数据
xhr.send()
//等待响应
1)异步:非阻塞,前面的代码不会影响后面代码的执行
(2)同步:阻塞
ajax: xhr.open(“get”,1.txt,true);
异步,ajax以非阻塞形式运行
得到ajax返回数据:
通过XMLHttpRequest对象的两个属性
(1)responseText:获得字符串形式的响应数据
(2)responseXML:获得 XML 形式的响应数据
1)readyState属性:ajax工作状态
(2)每当readyState的值发生改变时,就会触发onreadystatechange事件
需要进行容错处理:使用HTTP状态码
status:1(消息)2(成功)3(重定向)
4(请求错误)5(服务器错误)