$.ajax的基本使用
作为一个前端程序员必须要与后端的数据做交互，此时就应用到了 ajax 来获取数据。
首先引入jquery（这里引入的在线地址）
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script>
Demo：
首先在HTML中建立基本元素：
<div class="first"></div> <div class="second"></div> <div class="second1"></div>
接着我们获取一下地址：
var baseUrl = ‘http://81.70.146.54:2222/‘; // 此地址为真是地址
getPageTotalAndDataTotal()
function getPageTotalAndDataTotal(page) {
// 获取页数与数据总数
$.ajax({
url: baseUrl + "news/findStatus",
type: "post",
async: false,//此处需要注意的是要想获取ajax返回的值这个async属性必须设置成同步的，否则获取不到返回值
data: {}, // 需要提交的数据
dataType: "json", // 数据使用JSON格式进行传输
success: function (data) { // 成功回调，返回的数据根据结果进行相应的会处理
console.log(data)
console.log(data.data)
var status = data.data;
// console.log(status)
if (data.code == ‘1‘) { // 成功获取到数据拎出去单写
init(status)
}
}
});
}
接着我们拎出来单写：
方法 一：（此时页面已经展示数据了）
function init(status) { // status是必须要传的值
$(‘.first‘).empty();
$(‘.first‘).text(status[0].title)
$(‘.second‘).text(status[1].title)
}
方法二：
function init(status) { // status参数必须传
var firstData = status[0].title; // 定义相应的参数
var secondData = status[1].content;
firstText(firstData) // 在相应的方法里面进行相应参数的传递
secondText(secondData)
}
function firstText(firstData) {
$(‘.first‘).text(firstData)
}
function secondText(secondData) {
$(‘.second‘).text(secondData)
$(‘.second1‘).html(secondData) // 因为返回的数据本身自带标签可以用 $().html() 来解决
}
此时数据已经展示在页面了。
大概就这样了！（有好的建议可以进行互动与交流）