ajax网络请求

Posted 2021-04-15 忆站

AJAX = Asynchronous javascript and XML（异步的 JavaScript 和 XML）

它是浏览器提供的一套方法，可以让用户在不刷新页面的情况下更新用户数据，提高用户体验。也就是在用户浏览网页的同时局部更新页面的数据。

ajax的实现实现步骤：

• 创建ajax对象，依赖是浏览器提供的XMLHttpRequest对象。

• 发送请求，使用send方法。

• 获取服务器响应数据。

在ajax中有几个关键的数据对象和方法：

属性/方法	描述
发送阶段的以下方法处理：
open(methods, url, async)	规定请求的类型、URL 以及是否异步处理请求。
send(string)	发送请求出具。string仅用于post请求。
onload()	请求成功时触发
onreadystatechange()	当 readyState 改变时，就会触发 onreadystatechange 事件,一般我们监听这个函数处理数据。
获取来自服务器的响应：
responseText	获得字符串形式的响应数据。
responseXML	获得 XML 形式的响应数据。
readyState	存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。 0: 请求未初始化 1: 服务器连接已建立 2: 请求已接收 3: 请求处理中 4: 请求已完成，且响应已就绪
status	响应状态码:一般200: "OK"，404: 未找到页面

so,根据以上理论知识我们可以构建一个简单的ajax请求了：

function getData () { var xhr = new XMLHttpRequest() xhr.onreadystatechange = function () { if (xhr.readyState == 4 && xhr.status === 200) { console.log('数据返回成功', xhr.responseText) } }  xhr.open('get', 'http://127.0.0.1:3000') xhr.send()}