Блог

У меня возникла проблема с извлечением и добавлением значений из API погоды в мои HTML-элементы.

Я пытаюсь спрогнозировать сегодняшний день с сегодняшнего дня до полуночи (на следующий день) и показывать прогноз по часам.

Чтобы освободить место, я использовал цикл while, но когда я получаю данные, браузер не работает.

Вот пример JSON, который я получаю : https://pastebin.com/ZjNh67Ni

Вот код, который портит браузер :

 for(let k = 0 ; k < value.forecast.forecastday[0].hour.length ; k  ) {
                let l = k   1;
                while(startHour   k < value.forecast.forecastday[0].hour.length) {
                    while(todayWeather.children[l] != undefined) {
                        todayWeather.children[l].children[0].innerHTML = new Date(value.forecast.forecastday[0].hour[startHour   k].time).getHours();
                    }
                }
            }
 

Вот структура HTML :

 <div class="forecast-weather-box" id="today-h0">
   <h4 class="hour"></h4>
   <img src="" class="icon"/>
   <h4 class="temp-c"></h4>
</div>
 

Объяснение строка за строкой js :

Я просто расскажу вам, каковы переменные : таким образом, var «значение» на самом деле является файлом JSON. Var StartHour-это круглое число текущего часа. И сегодня Weather-это большой div, который содержит много маленьких дивов, подобных приведенному выше HTML-коду.

Итак, в первой строке я создаю цикл, который повторяется 24 раза (количество часов).

Я создаю переменную l, которая имеет на одно число больше, чем k.

В то время как текущий час k меньше 24,

В то время как дочерний элемент l большого div определен,

Затем я добавляю значение к первому дочернему элементу дочернего элемента k и даю HTML-коду час.

Значение l имеет на одно число больше, чем k, потому что первый элемент большого div (так что 0 в массиве) — это просто заголовок, а не другой div.

Я надеюсь, что я был ясен в своих объяснениях. Большое вам спасибо за вашу помощь, ребята

Ни k то, ни l другое не меняется внутри вашего цикла while, поэтому, если условие верно, оно останется верным навсегда. Замените оба момента на если или используйте условие, которое меняется между итерациями.