Ajax请求

原生Ajax请求

一、创建XMLHttpRequest对象

var xhr = null;
if(window.XMLHttpRequest){//标准浏览器
    xhr = new XMLHttpRequest();
}else{//早期的IE浏览器
    xhr = new ActiveXObject("Microsoft.XMLHTTP");
}

二、准备发送请求-配置发送请求的一些行为

xhr.open('get','text.php',true);

第一个参数:请求方式
第二个参数:请求文件
第三个参数: 默认为true表示异步请求

第三步：执行发送的动作

xhr.send(null);

get请求方式发送为空
post发送需要发送到服务器的内容

第四步：指定回调函数

xhr.onreadystatechange = function(){          
    if(xhr.readyState == 4){                  
        if(xhr.status == 200){//请求事成功的        
            var data=xhr.responseText;//json               
        }                                     
    }                                         
     console.log("状态t"+xhr.readyState);       
}

xhr.readyState的返回值和对应含义
0.对象创建
1.准备好发送，还没发
2.已经发送完毕
3.服务器已返回数据
4.返回的数据已可以使用
xhr.status的返回值及含义

代码	说明
2xx	成功
3xx	重定向
4xx	请求错误
5xx	服务器错误

var url = '05open.php?username='+ encodeURIComponent(username) +'&password='+password;

encodeURIComponent(username)防止用户名中有汉字出现乱码

jQuery方法的Ajax请求

首先引入jQuery库

$.ajax({                    
    url:"text.php",         
    dataType:"json",        
    type:"post",            
    data:null,              
    success:function(data){ 
        setcontent(data);   
        console.log(data);  
    },                      
    error:function(e){      
        console.log(e);     
    }                       
});                                                                                                  

参数	含义
url	请求的服务器文件
dataType	要求返回的数据类型
type	请求方式
data	传送给服务器的数据
success:function(data){ }	请求成功执行的函数
error:function(e){ }	请求失败执行的函数

data服务器返回的数据
e错误代码
data的书写格式
data:{name:"myName",id:1},