ajax可以理解为在后台偷偷摸摸的刷新又不告诉你。

它的工作流程是这样的：点击页面标签->发送请求到后端，拿到一个结果->把结果显示到页面

那我们转换成计算机语言就应该是4步

1.先实例化js的XMLHttpRequest这个内置对象

var xhr = new XMLHttpRequest;

2.设置open这个方法准备请求

xhr.open(method,页面); //第一个参数是设置method是GET还是POST，第二个页面是后端操作

注意。

GET请求

xhr.open("get","index.php?id=1&sid=1"); //是把值放到地址栏传过去

POST请求

xhr.open("post","index.php"); //如果是post的话地址栏后面为空

3.调用send方法把信息提交到后端

GET请求

xhr.send(); //就这样就好了

POST请求

xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");

xhr.send("id=1&sid=1"); //注意要设置请求头，设置为表单请求，把值放在send内

4.取得效果之后显示到前端

4-1.判断是否已经执行完毕

xhr.onloadend = function(){
    //4-2.执行完毕，判断响应头是否为200.判断是否正常的意思  
    if(xhr.status==200){
        //如果进来这里就代表一切正常。能拿到值了  
        alert(xhr.responseText);
    }
}

上面就是怎么用js来实现ajax。那如果是jquery里面就方便多了

在jQuery中。如果需要调用ajax，就需要先导入jquery包然后调用ajax的方法

1.导入jQuery包

2.调用ajax方法。在jquery中有6个ajax相应的常用方法需要我们去学的

2-1：load

load是把加载页面的内容显示到当前页面上

$("#div").load("index.php",[JSON data],[function]);

把JSON对象的内容传到index.php做处理之后把页面输出的内容返回到#div内

2-2：get

$.get("index.php",[JSON data],function,[type]);

把JSON对象内容传到index.php做处理，执行成功后会调用function方法，type参数如果为json则会返回一个JSON对象

当然也可以把JSON data写在index.php后面：index.php?id=1&username=1;

2-3：post

$.post("index.php",[JSON data],function,[type]);

原理是与GET相同的。不过不可以把值放在index.php后面

2-4：ajax

$.ajax({
    url:"index.php",
    type:"post",
    data:"id=1&username=1",
    dataType:"json", //如果选了json就会返回json对象
    success:function(val){//ajax成功就执行},
    beforeSend:function(){//准备发送ajax之前执行},
    complete:function(){//无论成功还是失败都会执行}
})

其实$.ajax就是$.get和$.post的底层，当执行成功之后就会执行函数

2-5：ajaxStart

$("#loading").ajaxStart(function(){//当ajax准备发送之前执行})

2-6:ajaxStop

$("#loading").ajaxStop(function(){//当ajax完成之后执行})

我们可以这么理解。complete和ajaxStop是一对，beforeSend和ajaxStart是一对。

假如我需要在异步加载之前显示一个loading的圈圈。异步完成就隐藏。

如果我们是用$.ajax()就可以用beforeSend和complete来完成了。

但是如果我们要用$.post的话，就没有这功能，所以只能用ajaxStart和ajaxStop来完成。

可以这么理解。beforeSend、complete是私有的，而ajaxStart和ajaxStop是共有的。当设了beforeSend的同时又存在ajaxStart的话会执行beforeSend

我是庆恺。这是一个程序员+运营新人的自媒体号，记录着自己的一路成长，如果你觉得这篇文章对您有帮助，我会觉得，这世界上至少有人因为我而得到改变。原创文章，转载请标明出处。谢谢。