javascript - 我在使用 setInterval 时遇到问题

Question

最近几天我一直在研究这个，它看起来很简单，但我无法让它正常工作。我试图每 10 秒显示一次关于兔子的事实。我已经编写了数组、循环和函数，但它只显示数组中的最后一项。

var bunnyArr = ["Rabbits don't eat root vegetables, such as carrots", "baby rabbits are called kittens", "A group of rabbits are called a fluffel"];

function bunnyStat() {

    for (i = 0; i < bunnyArr.length; i++) {
        document.getElementById('listItem1').textContent = bunnyArr[i]
    }

}
setInterval(bunnyStat, 10000);

它也没有给我任何错误，所以我不知所措。

Answer 1

您的函数一次遍历所有数组，这就是您只看到最后一个的原因。

在函数外部保留一个计数器并在每次调用时递增它:

var bunnyArr = ["Rabbits don't eat root vegetables, such as carrots", "baby rabbits are called kittens", "A group of rabbits are called a fluffel"];

var index = 0;
var total = bunnyArr.length;

function bunnyStat() {
    if (index == total) {
        index = 0;
    }
    document.getElementById('listItem1').textContent = bunnyArr[index++];
}

setInterval(bunnyStat, 10000);

<div id="listItem1"></div>