用js中的setInterVal定时器实现三个div圆形的红绿黄灯闪烁，举例代码

在JavaScript中，你可以使用`setInterval`函数配合CSS样式，创建一个三色灯闪烁的效果。下面是一个简单的示例代码，它设置了三个轮播的div元素，分别代表红、绿、黄三种颜色：

HTML部分:

<div id="light-red" class="circle"></div>
<div id="light-green" class="circle"></div>
<div id="light-yellow" class="circle"></div>

CSS部分 (假设`.circle`有一个默认大小圆角背景):

.circle {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: red;
  display: none;
}

JavaScript部分:

let colors = ['red', 'green', 'yellow'];
let index = 0;
const intervalId = setInterval(() => {
  document.getElementById('light-' + colors[index]).style.display = 'block';
  setTimeout(() => {
    document.getElementById('light-' + colors[index]).style.display = 'none';
    if (++index === colors.length) {
      index = 0; // 如果到达最后一个，回到第一个
    }
  }, 1000); // 每种颜色显示1秒后隐藏
}, 1000);

// 清除定时器防止内存泄漏，在不需要时关闭灯光循环
function stopLightAnimation() {
  clearInterval(intervalId);
}

// 当需要停止动画时调用这个函数

在这个例子中，我们每秒钟切换一次颜色，并且每个颜色持续显示1秒。当所有颜色都显示过后，会重新从第一个开始。