既然提到Ajax，那就先来说一说什么是Ajax吧
关于Ajax
Ajax的定义
Asynchronous JavaScript And XML：异步的JavaScript和XML。
反正就是一句话总结：
使用XML HttpRequest 对象与服务器进行通讯。
AJAX 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。（这一句话很好的诠释了异步的概念）
无需多言，开始正题
关于axios
什么是axios
Axios 是一个基于Promise的HTTP 客户端，适用于node.js和浏览器。它是同构的（即它可以使用同一套代码运行在浏览器和 nodejs 中）。在服务器端它使用原生的 node.js http模块，在客户端（浏览器）它使用 XMLHttpRequests。
特性
当然，下面是从官网上找的东西
使用
导入
我最常用的方法是直接导入地址
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>请求方法
这是在学习过程中做的一些小总结，其实最常用的是get和post方法
其实这两个最大的区别就是在请求的数据，缓存和安全性的区别
这算是整体一点的，大总结，这四个方法的区别
| get | post | put | delete | |
| 描述 | 查看 | 创建 | 更新 | 删除 |
| 定义 | 从指定资源请求数据 | 向指定资源提交要处理的数据 | 更新指定资源的全部内容 | 删除指定资源 |
| 请求格式 | 参数在 URL 中 | 数据在请求体中 | 数据在请求体中 | 通过 URL 指定资源标识符 |
| 对服务器性能的影响 | 较小 | 较大 | 较大 | 较大 |
| 是否适用对同一个资源进行多次操作 | 可查询 | 否 | 否 | 否 |
| 应用场景 | 获取网页、查询数据 | 创建新资源 | 更新已存在资源（完整更新） | 删除已存在资源 |
| 优点 | 可以被缓存和浏览器保存。 对服务器性能的影响较小。 | 可以提交比 相对更安全，因为请求参数不会被包含在 URL 中。 | 可以更新指定的资源。 | 可以永久删除指定的资源。 |
这是最一开始学习Ajax时做的一个思维导图
语法
axios({url:"目标资源地址/要访问的后端接口地址",method:"请求方法", // 请求的方法，GET可以省略（不区分大小写）data/params:{ // data是提交的数据参数名1：值1,参数名2：值2}// 使用回调函数
}).then((result)=>{对服务器返回的数据进行处理
})前提要知道，
如何使用URL查找对应参数：
使用URL查询参数的作用：浏览器提供给服务器额外信息，获取对应的数据。
而相对应的使用axios查询：
就是使用params参数进行查询，携带参数名和值
例：
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1.0"><title>axios——get</title><style type="text/css">#dv {border: 1px solid pink;}</style></head><body><h1>axios_get</h1><form action="javascript:;" class="example-form"><input type="text" name="name" id="name"><br><input type="text" name="text1" id="text1"><br><input type="button" class="btn" id="btn" value="提交"></form><div id="dv"></div><script src="https://unpkg.com/axios/dist/axios.min.js"></script><script>btn.onclick = function(){var n = document.getElementById('name').valuevar t = document.getElementById('text1').valueconsole.log(n);console.log(t);axios({url: 'http://localhost:8080/getAjaxTest',method: 'GET',params: {name: n,text1: t}}).then(result => {console.log(result);console.log(result.data);var p = document.createElement("p");p.appendChild(document.createTextNode(result.data));var ps = document.getElementById("dv").getElementsByTagName("p");// +的优先级比？高,所以要加括号new Function("p", "ps", 'document.getElementById("dv").' + (ps[0] ?"insertBefore(p, ps[0])" : "appendChild(p)"))(p, ps);}).catch(error => {console.log(error);});}</script></body>
</html>就会由于使用params的方式，会从网络中显示出来，（如果不清楚，可以看下面的查找错误）
主要可以看这里的思路和结构，其实这里也有一个知识点：
在 params的参数中，如果参数名和值一样，可以只写一个：
params: {name, // 当参数名和值都为nametext1
}错误处理
在then方法的后面，通过点语法调用catch方法，传入回调函数并定义参数
axios({// 请求选项
}).then(result=>{// 处理数据
}).catch(error=>{// 处理错误
})在哪用：
注册账号时，重复注册时通过弹窗提示用户错误原因
查找错误：
这就是我们需要了解的HTTP协议--请求报文和响应报文
请求报文：
响应报文：
例：
还拿上一个我的代码举例：
这是点击提交后的页面效果
接下来我们看提交结果的内部是什么样的
在这里可以明显看出来哪里是响应哪里是请求
算了还是用edge吧
请求报文在标头那里
所以可以依据这些查看是客户端还是服务端的错误
最后一些需要注意的点
既然最开始提到了params和data，那他们有什么区别呢
| 比较项目 | data 参数 | params 参数 |
| 传输方式 | 放在请求体中传输 | 通过 URL 进行传输，拼接在 URL 末尾 |
| 使用场景 | 适用于 POST、PUT、PATCH 等非 GET 请求，用于向服务器提交数据以创建、更新或修改资源 | 主要用于 GET 请求，让服务器根据参数筛选、排序或返回特定资源 |
| 数据大小限制 | 相对没有严格的类似 URL 长度那样的限制（实际受服务器配置等因素影响），更适合大量数据传输 | 受 URL 长度限制，过长 URL 可能导致请求失败 |
| 安全性 | 不在 URL 中显示数据，一定程度上保护隐私和安全性，适合传递敏感信息 | 数据在 URL 上可见，不适合传递敏感信息如密码等 |
就先说这些吧，其他的如果什么时候想起来了，可能会继续补充（虽然可能性不大）
如果文章中有什么错误，欢迎在评论区提出。
