AJAX 代表异步 JavaScript 和 XML。它是一组用于创建交互式 Web 应用程序的 Web 开发技术。 AJAX 允许网页与服务器通信，而无需重新加载页面。
就绪状态是处理 AJAX 请求的重要部分。请求的就绪状态向服务器指示请求的状态，并允许客户端跟踪请求的进度。
下面我们详细介绍了 AJAX 的不同就绪状态。
未发送状态（0）
这是 AJAX 的第一个就绪状态。它用整数 0 表示。当使用 AJAX 请求时，请求处于“未发送”状态，直到调用 send() 方法为止。这意味着请求还没有发送到服务器，说明请求还需要发送。此状态也称为 XMLHttpRequest.UNSENT。
语法
http.onreadystatechange = function () {
if (this.readyState == 0) {
//put your code here
console.log('This is UNSET state')
}
}
打开状态（1）
这是 AJAX 的第二个就绪状态。用整数1表示。AJAX请求的打开状态是当请求发送到服务器，但尚未收到响应时。这通常是 AJAX 请求周期的第一步，通常由用户操作（例如按钮单击或表单提交）触发。这表明请求已打开并且请求标头已发送。
例如，当用户单击按钮提交表单时，AJAX 请求将发送到服务器，服务器然后处理该请求并发回响应。然后，浏览器处理该响应，并相应地更新页面。另一个例子是，当用户单击链接加载更多内容时，AJAX 请求将发送到服务器以获取附加内容，然后将其显示在页面上。
语法
http.onreadystatechange = function () {
if (this.readyState == 1) {
//put your code here
console.log('This is OPENED state')
}
}
HEADERS_RECEIVED 状态 (2)
这是 AJAX 的第三个就绪状态。它用整数 2 表示。 已接收标头是 AJAX 中请求的一种状态，在发送请求并且服务器用其标头进行响应时发生。服务器已收到请求并正在准备响应，表明已收到响应标头。
例如，当用户发送查看网页的请求时，服务器将通过发回页面标头进行响应。这些标头包含内容类型、页面长度以及页面上次修改日期等信息。
另一个示例是用户向服务器发送下载文件的请求。服务器将通过发回文件头进行响应，例如文件的大小和类型以及上次修改的日期。
语法
http.onreadystatechange = function () {
if (this.readyState == 2) {
//put your code here
console.log('This is HEADERS_RECEIVED state')
}
}
加载状态（3）
AJAX 中请求的加载状态是指将请求发送到服务器并收到响应时。在此期间，请求的状态为“loading”，表示正在接收响应正文。
例如，当用户单击按钮提交表单时，加载状态是指表单提交并从服务器返回响应（例如成功或错误消息）时。
另一个示例是当用户单击链接来导航新页面时。加载状态是指单击链接并加载新页面时。
语法
http.onreadystatechange = function () {
if (this.readyState == 3) {
//put your code here
console.log('This is LOADING state')
}
}
完成状态 (4)
AJAX 中请求的完成状态是指请求已完成并收到响应时。此时服务器已响应请求，并且数据可用于进一步处理。这表明请求已完成并且已收到响应。
语法
http.onreadystatechange = function () {
if (this.readyState == 4) {
//put your code here
console.log('This is DONE state')
}
}
示例
在此示例中，我们将执行 AJAX 调用并查看不同的就绪状态。我们将更新不同州的网页，说明其当前状态。我们无法执行 UNSENT 状态，因为此状态仅在发送 AJAX 调用之前可用。我们使用按钮单击事件处理程序来触发 AJAX 调用。
<html>
<body>
<h2>Different <i>Ready State</i> of AJAX</h2>
<button onclick = "ajaxCall()">Trigger AJAX Call</button>
<div id = "root" style = "border: 1px solid black; padding: 1%"></div>
<script>
let root = document.getElementById('root')
function ajaxCall() {
root.innerHTML = 'AJAX Call Started! <br /><br />'
//AJAX Call
let http = new XMLHttpRequest()
http.onreadystatechange = function () {
if (this.readyState == 1) {
root.innerHTML += 'This is OPENED state <br />'
}
if (this.readyState == 2) {
root.innerHTML += 'This is HEADERS_RECEIVED state <br />'
}
if (this.readyState == 3) {
root.innerHTML += 'This is LOADING state <br />'
}
if (this.readyState == 4) {
root.innerHTML += 'This is DONE state <br />'
}
}
http.open('GET', 'https://jsonplaceholder.typicode.com/posts/', true)
http.onload = function () {
root.innerHTML += '<br />AJAX Call Completed!'
}
http.send()
}
</script>
</body>
</html>
结论
在 JavaScript 中，AJAX 请求有四种不同的就绪状态：未发送、打开、收到标头和完成。未发送状态是指请求尚未发送到服务器。打开状态是当请求已发送到服务器但尚未收到响应时。标头接收状态是服务器已使用其标头进行响应并正在准备响应时的状态。完成状态是指请求已完成并且已收到响应。这些就绪状态中的每一个都可以通过 XMLHttpRequest 对象的readyState 属性来访问。它们对于跟踪 AJAX 请求的进度并适当处理响应非常有用。
以上就是解释 AJAX 中请求的不同就绪状态的详细内容，更多请关注双恒网络其它相关文章！
2. 分享目的仅供大家学习和交流，您必须在下载后24小时内删除！
3. 不得使用于非法商业用途，不得违反国家法律。否则后果自负！
4. 本站提供的源码、模板、插件等等其他资源，都不包含技术服务请大家谅解！
5. 如有链接无法下载、失效或广告，请联系管理员处理！
6. 本站资源售价只是赞助，收取费用仅维持本站的日常运营所需！
7. 如遇到加密压缩包，请使用WINRAR解压,如遇到无法解压的请联系管理员！
8. 精力有限，不少源码未能详细测试（解密），不能分辨部分源码是病毒还是误报，所以没有进行任何修改，大家使用前请进行甄别
9.本站默认解压密码为:www.sudo1.com
本站提供的一切软件、教程和内容信息仅限用于学习和研究目的。
不得将上述内容用于商业或者非法用途，否则，一切后果请用户自负。
本站信息来自网络收集整理，版权争议与本站无关。您必须在下载后的24个小时之内，从您的电脑或手机中彻底删除上述内容。
如果您喜欢该程序和内容，请支持正版，购买注册，得到更好的正版服务。
我们非常重视版权问题，如有侵权请邮件与我们联系处理。敬请谅解！
云资源网 » 解释 AJAX 中请求的不同就绪状态
常见问题FAQ
- 免费下载或者VIP会员专享资源能否直接商用？
- 本站所有资源版权均属于原作者所有，这里所提供资源均只能用于参考学习用，请勿直接商用。若由于商用引起版权纠纷，一切责任均由使用者承担。更多说明请参考 VIP介绍。
- 提示下载完但解压或打开不了？
- 你们有qq群吗怎么加入？
