使用jQuery连续添加和删除类到随机元素

假设我有十个元素的无序列表。
我希望随机将一个类添加到其中一个类中，然后在几秒钟后删除该类，并再次使用另一个随机选择的元素无限期地重新开始。

实现这一目标的最简洁方法是什么？

编辑：到目前为止我得到了什么：

 
...
 
...
 
...
 
...
 ...  

和jQuery：

 var random = Math.floor(Math.random() * 1000); var shownElement = $("#hideAndSeek li"); shownElement.eq(random % shownElement.length).addClass("shown"); 

但是，这显然不会连续运行，我不知道如何在删除类之前正确设置延迟。

Answer 1

您需要使用setInterval来创建计时器，然后您可以选择一个随机数并为该项索引设置类。

像这样的东西：

HTML

 
 
one
 
two
 
three
 
four
 
five
 
six
 
seven
 
eight
 
nine
 
ten
  

Javascript（带JQuery）

 setRandomClass(); setInterval(function () { setRandomClass(); }, 2000);//number of milliseconds (2000 = 2 seconds) function setRandomClass() { var ul = $("ul"); var items = ul.find("li"); var number = items.length; var random = Math.floor((Math.random() * number)); items.removeClass("special"); items.eq(random).addClass("special"); } 

这是一个有效的例子

Answer 2

可以做这样的事情：

HTML

 
 
test1
 
test2
 
test3
 
test4
 
test5
 
test6
 
test7
 
test8
 
test9
 
test10
  

jQuery的

 var tid = setInterval(changeUp, 1000); function changeUp() { var i = Math.floor((Math.random()*9)); $('#randomCol').children().removeClass('color'); $('#randomCol').children().eq(i).addClass('color'); } 

小提琴