使用ajax发起GET请求
$(function () {
$('#btnGET').on('click', function () {
$.ajax({
type: 'GET',
url: 'http://www.llb.top:3006/api/getbooks',
data: {
id: 1
},
success: function (res) {
console.log(res)
}
})
})
})
使用ajax发起POST请求
$(function () {
$('#btnPOST').on('click', function () {
$.ajax({
type: 'POST',
url: 'http://www.llb.top:3006/api/addbook',
data: {
bookname: '史记',
author: '司马迁',
publisher: '上海图书出版社'
},
success: function (res) {
console.log(res)
}
})
})
})
使用ajax发起跨域请求
$.ajax({
method: 'GET',
url: 'http://www.llb.top:3006/api/jsonp',
data: {
name: 'zs',
age: 20
},
success: function (res) {
console.log(res)
}
})
使用axios发起POST请求
document.querySelector('#btn4').addEventListener('click', function () {
axios({
method: 'POST',
url: 'http://www.llb.top:3006/api/post',
data: {
name: '娃哈哈',
age: 18,
gender: '女'
}
}).then(function (res) {
console.log(res.data)
})
})
使用jQuery发起JSONP数据请求
<script>
$(function () {
// 发起JSONP的请求
$.ajax({
url: 'http://www.liulongbin.top:3006/api/jsonp?name=zs&age=20',
// 代表我们要发起JSONP的数据请求
dataType: 'jsonp',
// jsonp: 'cb', // 自定义参数名字
jsonpCallback: 'abc', // 自定义回调函数名(参数的值)
success: function (res) {
console.log(res)
}
})
})