gpt4 book ai didi

javascript - 开始通过 XMLHttpRequest 调用 API

转载 作者:行者123 更新时间:2023-11-30 07:39:22 24 4
gpt4 key购买 nike

我刚刚开始学习如何使用 API,但在理解如何使用它们时遇到了一些困难。

感谢一些在线文档,我能够编写以下代码,但我对如何添加到其中有一些疑问:

var xhr = new XMLHttpRequest();
xhr.open("GET", "http://api.openweathermap.org/data/2.5/weather?q=London&mode=xml", false); xhr.send();
console.log(xhr);

现在,当我在浏览器中运行这段代码并打开控制台时,我会看到一个下拉菜单,下面有一大堆东西。首先,我怎样才能让代码只显示响应?我希望控制台在我运行代码时仅显示要显示的 XML。其次,我如何解析 XML?有没有什么方法可以从 XML 元素中获取值并将其分配给 JavaScript 变量?

谢谢!

最佳答案

您正在打印的是 XMLHttpRequest 对象本身,而您真正想要的是您发出的请求的响应。要获得响应,您可以使用

xhr.responseXML;

这是文档类型的对象。 (参见 MDN docs)。

要展示代码,你可以

console.log(xhr.responseXML);

但要实际处理响应,您可能希望按照 Josh 的建议进行操作,并从 API 请求 JSON 格式的响应(而不是 XML 格式的响应)。

您可能也想异步执行此操作(参见 this )。该页面有一个更强大的示例。让我们对其进行调整以显示伦敦的温度:

var xhr = new XMLHttpRequest();
xhr.open("GET", "http://api.openweathermap.org/data/2.5/weather?q=London&mode=json", true);
xhr.onload = function (e) {
if (xhr.readyState === 4) {
if (xhr.status === 200) {
console.log(xhr.responseText);
var response = JSON.parse(xhr.responseText);
console.log("Temperature(K): " + response.main.temp);
} else {
console.error(xhr.statusText);
}
}
};
xhr.onerror = function (e) {
console.error(xhr.statusText);
};
xhr.send(null);

异步意味着 xhr.onLoad 函数将在收到响应后立即执行。因此,您的所有代码都将按顺序执行,并且只有在收到响应时才会执行 onLoad。

关于javascript - 开始通过 XMLHttpRequest 调用 API,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21317672/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com