1.什么是Ajax
异步刷新技,用来 在当前页面相应不同的请求内容。
ajax.open("请求方式","URL","同步,异步(true异步,false同步;默认为异步"," ");
2.为什么需要Ajax
需求:
有时候我们需要将本次的响应结果和前面的响应结果内容在同一个页面中展示给用户。
解决:
1.在后台服务器端将多次响应重新拼接成一个JSP页面,响应(但是这样会造成很多响应内容被重复响应,资源浪费)
2.使用Ajax技术
3.ajax的使用:
ajax的基本流程
//创建Ajax引擎对象 var ajax; if(window.XMLHttpRequest){//火狐 ajax=XMLHttpRequest(); }else if(window.ActiveXObject){//ie ajax=ActiveXObject("Msxm12.XMLHTTP"); } //复写onreadystatement函数 ajax.onreadystatechange=function (){ //判断Ajax状态码 if(ajax.readyState==4){ if(ajax.status==200){ //获取响应内容 var result=ajax.responseText; alert(result); //获取元素对象 var showdiv=document.getElementById("showdiv"); showdiv.innerHTML=result; }else if(ajax.status==404){ //获取元素对象 var showdiv=document.getElementById("showdiv"); showdiv.innerHTML="请求资源不存在"; }else if(ajax.status==500){ //获取元素对象 var showdiv=document.getElementById("showdiv"); showdiv.innerHTML="服务器繁忙"; } } } //发送请求 ajax.open("get", "ajax"); ajax.send(null);
ajax的响应内容格式:
1.普通字符串responseText
2.json(重点)也是个字符串responseText
其实就是讲述数据按照json的格式拼接好的字符串,方便使用eval方法
将接收的字符串数据直接转换为js的对象
json格式:
var 对象名={
属性名:属性值,
属性名:属性值,
········
}
3.XML数据responseXML 返回document对象
通过document对象将响应数据从XML中获取出来
ajax的状态码
ajax.status//响应状态码 200:一切ok; 404:资源未找到; 500:服务器内部错误 ajax.readyState:0,1,2,3,4//ajax状态码 4:表示响应内容被成功接收
ajax的同步和异步
ajax.open("请求方式","URL","同步,异步(true同步,false异步;默认为同步"," ");ajax请求方式:
分为get请求和post请求:
get请求:
ajax.open("get","url?username=username&password=pwd"); ajax.send(null);//没有请求实体post请求:
ajax.open("post", "ajax"); ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); ajax.send("username=username&password=pwd");//有请求实体