Javascript 简单转盘滑块：将类移除到单击的元素，并将其添加到下一个同级

我想实现（用纯Javascript，而不是jQuery）一个简单的滑块/旋转木马，这样每当我点击一个图像时，它就会隐藏它，并显示下一个图像

下面的代码几乎可以工作，只是当我们到达末尾时，它不会循环。我曾考虑在这个例子中使用

if…

，但它不是很优雅

如何制作此旋转木马循环？

Array.from（document.getElementsByClassName（“imgslider”））.forEach（函数（元素）{
元素。addEventListener（'click'，函数（e）{
element.nextElementSibling.classList.toggle（“可见”）；
元素.classList.toggle（“可见”）；
});
});
.imgslider{display:none；}
.visible{display:block；}
我找到了一个解决方案，使用
（element.nextElementSibling | element.parentNode.firstElementChild）
：当没有“下一个”同级时，则
element.nextElementSibling
为
null
，而
element.parentNode.firstElementChild
给出第一个同级。这允许转盘在末端循环：


Array.from（document.getElementsByClassName（“imgslider”））.forEach（函数（元素）{
元素。addEventListener（'click'，函数（e）{
（element.nextElementSibling | | element.parentNode.firstElementChild）.classList.toggle（“可见”）；
元素.classList.toggle（“可见”）；
});
});
.imgslider{display:none；}
.visible{display:block；}