由于这段代码，我的浏览器滞后

Question

我在从天气 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 "value" 实际上是 JSON 文件。 var startHour 是当前小时的整数。而 todayWeather 是一个大 div，包含很多像上面的 HTML 代码一样的小 div。

所以第一行，我创建了一个循环重复 24 次（小时数）。

我创建了一个比 k 多一个数字的变量 l。

当当前小时 + k 小于 24 时，

虽然定义了大div的子l，

然后，我给孩子 k 的第一个孩子添加一个值，然后给 HTML 一个小时。

l 值比 k 多一个数字，因为大 div 的第一个元素（因此数组中的 0）只是一个标题，而不是其他 div。

我希望我的解释很清楚。非常感谢你们的帮助:)

Answer 1

k 和 l 在你的 while 循环中都没有改变，所以如果条件为真，它将永远保持为真。用 if 替换两个 while，或使用在迭代之间发生变化的条件。