42ajax,42 Ajax知识

Ajax学习

1、ajax的概念

局部刷新技术。不是一门新技术，是多种技术的组合。是浏览器端的技术。

2、ajax的作用

实现在当前结果页中显示其他请求的响应内容

3、ajax的使用

ajax的基本流程

创建ajax引擎对象

复写onreadystatement函数

判断ajax状态码

判断响应状态码

获取响应内容(响应内容的格式)

普通字符串：responseText

json(重点)：responseText

其实就是讲述数据按照json的格式拼接好的字符串，方便使用eval方法

将接受的字符串数据直接转换为js的对象

json格式：

var 对象名={

属性名:属性值,

属性名:属性值,

……

}

XML数据：responseXML.返回document对象通过document对象将数据从xml中获取出来

处理响应内容(js操作文档结构)

发送请求

get请求

get的请求实体拼接在URL后面，？隔开，键值对

ajax.open("get","url");

ajax.send(null);

post请求

有单独的请求实体

ajax.open("post", "url");

ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

ajax.send("name=张三&pwd=123");

ajax的状态码

ajax状态码:

readyState：0,1,2,3,4

4: 表示响应内容被成功接收

响应状态码:

status

200:表示一切OK

404:资源未找到

500：内部服务器错误

ajax的异步和同步

ajax.open(method,urL,async)

async：设置同步代码执行还是异步代码执行

true代表异步，默认是异步

false代表同步

示例

function getData(){

//创建ajax引擎对象

var ajax;

if(window.XMLHttpRequest){//火狐

ajax=new XMLHttpRequest();

}else if(window.ActiveXObject){//ie

ajax=new ActiveXObject("Msxml2.XMLHTTP");

}

//复写onreadystatement函数

ajax.onreadystatechange=function(){

//判断Ajax状态吗

if(ajax.readyState==4){

//判断响应状态吗

if(ajax.status==200){

//获取响应内容

var result=ajax.responseText;

//处理响应内容

//获取元素对象

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="服务器繁忙";

}

}else{

//获取元素对象

var showdiv=document.getElementById("showdiv");

showdiv.innerHTML="";

}

}

//发送请求

ajax.open("get","ajax",true);

ajax.send(null);

alert("哈哈");

}

来源：https://www.cnblogs.com/Scorpicat/p/12394738.html