Ajax 请求简介:
Ajax 即“Asynchronous Javascript And XML”(异步 JavaScript 和 XML),是指一种创建交互式网页应用的网页开发技术
- ajax技术的目的:
- 是让js发送http请求,实现与服务端通信,即数据交互
- ajax的两个主要好处:
- 异步请求
- 局部刷新(无刷新)
- 数据接口:
- 数据接口是后台提供的,是一个url地址,通过访问该url,实现对服务端数据的增删改查操作,服务端一般返回的的数据以json格式封装
- 局部刷新(无刷新):
- ajax 可以实现 局部刷新,也叫做无刷新,无刷新指的是整个页面不刷新,只是局部刷新;
- ajax 可以自己发送 http 请求,不用通过浏览器的地址栏,所以页面整体不会刷新,ajax 获取到后台数据,更新页面显示数据的部分,就做到了页面局部刷新
- 常用参数:
- url : 请求地址
- type : 请求方式, 默认是"GET", 常用的还有POST
- dataType : 设置返回的数据格式, 常用的是"json"格式, 还有"HTML"格式
- data : 设置发送给服务器的数据
- success : 设置请求成功后的回调函数( 第二种方式用done )
- error : 设置请求失败后的回调函数, ( 第二种方式用fail )
Ajax 请求写法一:
<script>
$(function () {
$.ajax({
// 设置ajax的参数
// 请求数据的url地址:接口地址
url: '/index_data',
// 请求数据方式:get post
type: 'get',
// 返回的数据格式 json
dataType: 'json',
// data:发送给接口的数据
data:{"code":"30026"},
// 请求成功之后要执行的回调函数
success: function (dat) {
//dat:服务端返回的数据
console.log(dat)
},
// 请求失败
error: function (e) {
alert('请求失败')
}
})
})
</script>
Ajax 请求写法二 ( 推荐 ):
<script>
$(function () {
$.ajax({
url: '/index_data', //请求地址
type: 'get', //请求方式
dataType: 'json', //返回的数据格式
data:{'code':"000007"}
}).done(function(dat) {
// 请求成功之后要执行的回调函数
console.log(dat)
}).fail(function(e) {
// 请求失败之后要执行的回调函数
alert('请求失败')
})
})
</script>
Ajax请求写法三 ( 化简写法 ):
<script>
$(function () {
$.get("/add_data", {
"code":"000007"
},
function(dat){
//请求成功时回调函数
alert(dat)
})
})
</script>