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()更加灵活,功能更加丰富