jQuery中Ajax方法请求服务器 $.get() $.post() $.ajax()方法的使用格式

jQuery中Ajax方法请求服务器

1. $.get()方法的使用格式

作用：该方法是利用Ajax发送Get请求获取服务器上的数据
语法格式：$.get(url, [data], [callback], [type])
参数说明：

不带参数：

$.get(
      'http://127.0.0.1:3001/getHeroSkin', // 请求的服务器Api接口
      null,                               // 不带参数对象,可以填写null，或者直接省略此参数不写
      function(resData){console.log(resData);}// 回调函数处理服务器响应回来的数据
);

带参数：

$.get(
      'http://127.0.0.1:3001/getHeroSkin', // 请求的服务器Api接口
      {heroName:'白起'},                   // 带参数对象
      function(resData){console.log(resData);}// 回调函数处理服务器响应回来的数据
);

2. $.post()方法的使用格式

作用：该方法是利用Ajax发送Post请求将数据提交给服务器
语法格式：$.post(url, [data], [callback], [type])
参数说明：

带参数：

$.get(
      'http://127.0.0.1:3001/addHeroSkin',  // 请求的服务器Api接口
      { cname:'程咬金',skin_name:'华尔街大亨' },  // 带参数对象
      function(resData){console.log(resData);}// 回调函数处理服务器响应回来的数据
);

3. $.ajax()方法的使用格式

作用：该方法既能发送Get请求，也能发送Post请求，比 $.get()和 $.post()更加灵活，功能更加丰富
语法格式：

$.ajax({
url:' ', //请求URL地址
type:' ', //请求方式 Get 或 Post
data:{ } , // 本次请求要携带的参数
dataType:''  // 预期服务器返回的数据类型，例如：JSON，XML，JSONP等
success:function(resData){ } //请求成功后的回调函数
})

参数说明：

发送带参数的Get请求，典型特征：第二个参数传入了{属性名:属性值} 这样格式的一个对象

$.ajax({
    url:'http://127.0.0.1:3001/getHeroSkin',          // 请求api接口地址
    type:'GET',                                       // 表示发送get请求
    dataType:'json',				  // 表示服务器响应回来json格式数据
    data:{heroName:'白起'},                           // 表示查询英雄名称为“白起”的数据
    success:function(resData){console.log(resData);}  // 请求成功的数据存放在resData中
})

发送Post请求，将李白和皮肤数据提交给
http://127.0.0.1:3001/addHeroSkin

$.ajax({
    url:'http://127.0.0.1:3001/addHeroSkin,           // 请求api接口地址
    type:'POST',                                      // 表示发送POST请求
    dataType:'json',			             // 表示服务器响应回来json格式数据
    data:{cname:'李白',skin_name:'青莲剑仙'},         // 表示将此数据提交给url对应的接口地址
    success:function(resData){console.log(resData);}  // 请求成功的数据存放在resData中
})

jQuery中Ajax方法请求服务器小结

$.get()
该方法是利用Ajax发送Get请求获取服务器上的数据

$.post()
该方法是利用Ajax发送Post请求将数据提交给服务器

$.ajax()
该方法既能发送Get请求，也能发送Post请求，比 $.get()和 $.post()更加灵活，功能更加丰富