Jquery使用Ajax发送请求的四种方式

(记录) 方便回忆

$.ajax({})  (更全面可以触发多个函数)

当请求时间过长,可以在返回数据前的函数内操作界面,比如提示正在获取数据

          // ajax发送请求 (get / post)
              $.ajax({
              type:"GET",
              url:"/jqueryAjax",
              data:{
                  id:1
              },
              // 返回数据前触发
              beforeSend:function (){
                  $(".msg").show();
              },
              success:function (data){
                  // 数据来到之后先把之前的清空,再渲染新的数据
                  $(".info").html("");
                  $(data).each(function (index,user){
                      $("<tr><td>"+user.id+"</td><td>"+user.username+"</td><td>"+user.address+"</td></tr>").appendTo($(".info"));
                  })
              },
              // 失败时触发
              error:function (data){
                  console.log(data);

              },
              // 无论成功失败都会触发
              complete:function (){
                  $(".msg").hide();
              }
          });

$.get("/请求路径",{参数键值对},function(data){})

          // get
              $.get("/jqueryAjax",{id:3},function (data){
              // 数据来到之后先把之前的清空,再渲染新的数据
              $(".info").html("");
              $(data).each(function (index,user){
                  console.log(this)
                  console.log(typeof this)
                  $("<tr><td>"+user.id+"</td><td>"+user.username+"</td><td>"+user.address+"</td></tr>").appendTo($(".info"));
              })
          });

$.post("/请求路径",{参数键值对},function(data){})

          // post
          $.post("/jqueryAjax",{id:2},function (data){
              console.log(this)
              console.log(typeof this)
              // 数据来到之后先把之前的清空,再渲染新的数据
              $(".info").html("");
              $(data).each(function (index,user){
                  console.log(this)
                  console.log(typeof this)
                  $(".info").append("<tr><td>"+user.id+"</td><td>"+user.username+"</td><td>"+user.address+"</td></tr>");
                  // $("<tr><td>"+user.id+"</td><td>"+user.username+"</td><td>"+user.address+"</td></tr>").appendTo($(".info"));
              })
          });

$.getJSON("/请求路径",{参数键值对},function(data){})

              $.getJSON("/jqueryAjax",{id:4},function (data){
              // 数据来到之后先把之前的清空,再渲染新的数据
              $(".info").html("");
              $(data).each(function (index,user){
                  console.log(this)
                  console.log(typeof this)
                  $("<tr><td>"+user.id+"</td><td>"+user.username+"</td><td>"+user.address+"</td></tr>").appendTo($(".info"));
              })
          });