Нужно перечислить данные с открытой карты погоды - PullRequest
0 голосов
/ 06 апреля 2019

Я хотел бы перечислить ответ данных из текущих данных о погоде (открыть карту погоды). Я использую запрос ajax xhttp. Я для цикла и переменная с именем output, чтобы поместить данные из цикла for. Я не получаю никаких данных в выходной переменной.

Я пробовал console.log для данных, которые анализируются. И я получаю некоторые результаты. Так что API работает, не работает только цикл for.

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
    let output = "";
    var data = JSON.parse(this.response);
    console.log(data);

   for(var i = 0; i < data.length; i++){
    output += '<li>' + data[i] + '</li>';
   }
   console.log(output);
   document.getElementById('list').innerHTML = output;
}
};
xhttp.open("GET", "http://api.openweathermap.org/data/2.5/weather? 
q=London&appid=befb83bbddacf33f9ecfc1a5125d7201", true);
xhttp.send();

Html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Weather api</title>
</head>
<body>
<ul id="list">

</ul>
<script src="app.js"></script>
</body>
</html>

1 Ответ

0 голосов
/ 06 апреля 2019

API возвращает объект в формате

{"coord":{"lon":-0.13,"lat":51.51},"weather":anArray}

Поскольку объекты не имеют свойства длины, ваш цикл никогда не будет выполнен.

Предположительно, вы намеревались выполнить итерацию через .weather свойство вместо.Попробуйте это:

if (this.readyState == 4 && this.status == 200) {
    let output = "";
    var data = JSON.parse(this.response).weather;
    console.log(data);

   for(var i = 0; i < data.length; i++){
    output += '<li>' + data[i] + '</li>';
   }
   console.log(output);
   document.getElementById('list').innerHTML = output;
}

EDIT

Конкатенация объекта и строки неявно вызывает метод toString объекта, который возвращает [Object object].Вместо этого вам следует объединить строку со свойством .description.

Попробуйте это:

if (this.readyState == 4 && this.status == 200) {
    let output = "";
    var data = JSON.parse(this.response).weather;
    console.log(data);

   for(var i = 0; i < data.length; i++){
    output += '<li>' + data[i].description + '</li>';
   }
   console.log(output);
   document.getElementById('list').innerHTML = output;
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...