Question

怎么用js 中的定时器实现这种效果?

大家好 看看这个效果用原生js 怎么实现，貌似是用定时器一秒切换一个class，而且前三个是红色，其余的都是灰色，想请教一下各位这个怎么实现?

Answer 1

定时器循环，逐个处理。事先弄个div，在需要的时候显示出来，设置它显示的位置。你要动手写，不要光问，写写就自然会明朗起来。

Answer 2

如果你是在学习JS，下面是这个效果的实现思路：
首先，css样式部分需要写两个单独的class，一个是设置背景色为红色，一个是设置背景色为灰色。比如：
.red { background: red; }
.gray { background: gray; }
这两条样式只设置背景色，用来给定时器切换使用。
然后是Js部分的定时器实现逻辑：
第一步，获取需要切换class的所有标签，假设上面效果中的选项都使用的是a标签，即 var allA = parent.getElementsByTagName('a'); (parent为所有a标签的父级标签，需要提前获取)
第二步，声明一个变量用来当作索引（用来标记第几个要添加背景色）
var index = 0;
第三步，使用循环定时器（setInterval），在定时器中，先清除所有a标签上的className，然后给需要添加背景的a标签添加class，添加的时候判断当前的标签是不是第一个，是就用red背景的class，不是则用gray背景的class。
for () { allA[].className = '' }
allA[index].className = index == 0 ? 'red' : 'gray';
通过以上三个步骤就可以实现你所说的效果了。
上面的代码是基本思路，有所简化，并不是完整代码，对于初学者应该是可以理解的。