5个h3标签 使用js按照顺序改变颜色 颜色改为红色 改变后上一个标签恢复默认 一秒改变一次 重复执行 完整代码 vscode 上次一样的代码 带注释
<!--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>
原文地址: https://www.cveoy.top/t/topic/dq42 著作权归作者所有。请勿转载和采集!