语法
$.ajax(url, options);
options常用参数:
如果要处理 $.ajax() 得到的数据,则需要使用回调函数:beforeSend、error、dataFilter、success、complete。
在本地同目录新建一个data.txt
{
"total": 3,
"rows": [
{"id": 0, "name": "张三", "tel": "15002222111"},
{"id": 1, "name": "李四", "tel": "15002222111"},
{"id": 1, "name": "王五", "tel": "15002222333"},
]
}
ajax访问本地数据
$.ajax({
url: 'data.txt',
type: 'get',
success: function (result, status, xhr) {
console.log('请求成功:');
console.log(result);
},
error: function (xhr, status, error) {
console.log('请求失败:')
console.log(status)
console.log(error)
}
})
访问本地txt文件,返回的是字符串格式
访问get请求接口示例 接口url地址: /api/table/ 请求方式: get 接口返回
{
"total": 3,
"rows": [
{"id": 0, "name": "张三", "tel": "15002222111"},
{"id": 1, "name": "李四", "tel": "15002222111"},
{"id": 1, "name": "王五", "tel": "15002222333"},
]}
get请求示例
<script>
$.ajax({
url: '/api/table/',
type: 'get',
success: function (result, status, xhr) {
console.log('请求成功:');
console.log(result);
},
error: function (xhr, status, error) {
console.log('请求失败')
}
})
</script>
运行结果
ajax 发送请求后,接口返回status状态有五种:”success”, “notmodified”, “error”, “timeout”, or “parsererror” success 是指http协议状态码小于300的请求
$.ajax({
url: '/api/table/',
type: 'get',
success: function (result, status, xhr) {
console.log('请求成功:');
console.log(result);
console.log(status);
console.log(xhr);
},
error: function () {
console.log('请求失败')
}
})
返回结果
接口返回的是json数据,这里的result参数,已经解析成对象了,可以直接取值
$.ajax({
url: '/api/table/',
type: 'get',
success: function (result, status, xhr) {
console.log('请求成功:');
console.log(result);
console.log(status);
// result 对象取值
console.log(result.total);
console.log(result.rows);
console.log(result.rows[0]);
},
error: function () {
console.log('请求失败')
}
})
接口状态码大于300的都是error
示例
$.ajax({
url: '/api/table/',
type: 'get',
success: function (result, status, xhr) {
console.log('请求成功:');
console.log(result);
},
error: function (xhr, status, error) {
console.log('请求失败:')
console.log(status)
console.log(error)
}
})
当接口状态码301时:Moved Permanently
当接口状态码404时:Not Found
当接口状态码500时:Internal Server Error