一、什么是AJAX？
定义：AJAX 是异步的 JavaScript和XML(Asynchronous JavaScript And XML)。简单点说，就是使用XMLHttpRequest 对象与服务器通信。 它可以使用 JSON，XML，HTML 和 text 文本等格式发送和接收数据。AJAX最吸引人的就是它的“异步”特性，也就是说它可以在不重新刷新页面的情况下与服务器通信，交换数据，或更新页面。
概念：AJAX 是浏览器与服务器进行数据通信的技术，动态数据交互
二、怎么用AJAX？
1. 先使用 axios 库，与服务器进行数据通信。
> 基于 XMLHttpRequest 封装
> Vue、React 项目中都会用到 axios
2. 再学习 XMLHttpRequest 对象的使用，了解 AAX 底层原理
三、axios的使用
语法:
1.引入axios.js：https://cdn.isdelivr.net/npm/axios/dist/axios.min.is
2.使用 axios 函数
> 传入配置对象
> 再用 .then 回调函数接收结果，并做后续处理
需求：请求目标资源地址，拿到省份/城市列表数据，显示到页面
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- <p class="myp"></p> -->
<p class="myp1"></p>
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
<script>
// axios({
// 协议：//域名/资源路径
// url: 'http://ajax-api.itheima.net/api/province'
// }).then(result => {
// // 对服务器返回的数据进行后续处理
// console.log(result)
// console.log(result.data.data)
// // console.log(result.data.data.join('<br>'))
// document.querySelector('.myp').innerHTML = result.data.data.join('<br>')
// })
axios({
url: 'http://ajax-api.itheima.net/api/city',
params: {
//1.URL 查询参数有什么作用?
//浏览器提供给服务器额外信息，获取对应的数据
pname: '河北省'
//2.axios如何携带参数？
//使用 params {参数名：值}，携带参数名和值
}
}).then(result => {
console.log(result)
document.querySelector('.myp1').innerHTML = result.data.data.join('<br>') //以换行符连接
})
</script>
</body>
</html>四、axios 的核心配置?
1. url:请求 URL 网址
2. method:请求方法，GET可以省略(不区分大小写)
3. params:{查询参数：值}
4. data:提交数据
注意：
请求方法表明对服务器资源的操作，最为常用的2个是?
POST提交数据，GET查询数据
