Javascript 贯穿阵列&；添加/删除类

目前，我必须重建一些页面，用普通JavaScript替换jQuery。在我的例子中，我有一个div围绕着一些图像。第一个图像有一个css修饰符（-active），在JavaScript中，我需要一个循环来删除修饰符并将其提供给下一个图像。最后，修改器应该再次放置在第一个图像上。此函数也应每秒运行一次

html如下所示：

（函数（）{
var container=document.getElementsByClassName（'m-weatherMap\uuu image'）；
container=Array.from（container）；
timedLoop（）；
函数timedLoop（）{
var i=0；
setTimeout（函数（）{
i++；
timedLoop（）；
如果（i<容器长度）{
如果（！container[i].classList.contains（'-active'））{
设置超时（衰减，300）；
函数衰减（）{
容器[i-1].classList.remove（'-active'）；
容器[i-1]。style.opacity='0'；
}
容器[i].classList.add（'-active'）；
}
}
}, 1000);
}
})();
我认为这是一个不错的解决方案：


（函数（）{
var container=document.getElementsByClassName（'m-weatherMap\uuu image'）；
变量计数器=0
container=Array.from（container）；
setInterval（函数（）{
if（计数器===container.length-1）{
容器[counter].classList.remove（'-active'）；
容器[0]。类列表。添加（'-active'）；
计数器=0；
返回；
}
每次调用
timedLoop（）
时，如果（计数器）设置为
i=0
。为什么不使用
setTimeout（）
而不使用
setInterval（）