DEV Community
·
AJAX 请求数据获取
原文约600字/词，阅读约需2分钟。
📝
内容提要
文章介绍如何使用AJAX通过XMLHttpRequest从API获取数据。首先，创建fetchData()函数，并生成XMLHttpRequest对象。然后，用GET方法准备请求并指定API URL。请求成功且状态码为200时，解析JSON数据为JavaScript对象并在控制台显示。最后，使用xhr.send()发送请求。
🎯
关键要点
-
创建fetchData()函数以发送AJAX请求。
-
生成XMLHttpRequest对象以进行AJAX请求。
-
使用GET方法准备请求以从API获取数据。
-
当请求成功时，触发onload事件处理数据。
-
检查状态码是否为200以确认请求成功。
-
将JSON数据解析为JavaScript对象以便使用。
-
在控制台显示获取的数据以便调试。
-
使用xhr.send()发送请求到服务器。
❓
延伸问答
如何使用AJAX从API获取数据？
通过创建fetchData()函数，生成XMLHttpRequest对象，使用GET方法准备请求，并在请求成功时解析JSON数据。
XMLHttpRequest对象的作用是什么？
XMLHttpRequest对象用于发送AJAX请求，以便从服务器获取数据。
如何检查AJAX请求的成功状态？
通过检查xhr.status是否为200来确认请求是否成功。
获取到的数据如何处理？
使用JSON.parse()将响应的JSON数据解析为JavaScript对象，并在控制台显示。
AJAX请求的发送步骤是什么？
使用xhr.send()方法将请求发送到服务器。
AJAX请求的异步特性有什么好处？
异步请求允许页面在等待数据时继续执行其他操作，提高用户体验。
🏷️
