<!--HTML代码-->
<h3>标题1</h3>
<h3>标题2</h3>
<h3>标题3</h3>
<h3>标题4</h3>
<h3>标题5</h3>
<!--JS代码-->
<script>
//获取所有的h3标签
const h3List = document.querySelectorAll('h3');
//设置初始索引值
let index = 0;
//设置定时器
setInterval(() => {
  //将上一个h3标签的颜色恢复默认
  if (index > 0) {
    h3List[index - 1].style.color = '';
  }
  //将当前h3标签的颜色改为红色
  h3List[index].style.color = 'red';
  //更新索引值
  index++;
  //如果索引值大于等于h3标签的数量,重置为0
  if (index >= h3List.length) {
    index = 0;
  }
}, 1000);
</script>
5个h3标签 使用js按照顺序改变颜色 颜色改为红色 改变后上一个标签恢复默认 一秒改变一次 重复执行 完整代码 vscode 上次一样的代码 带注释

原文地址: https://www.cveoy.top/t/topic/dq42 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录