<!DOCTYPE HTML><HTMLLang= "en"><Head> <MetaCharSet= "UTF-8"> <title></title> <style>#all{Margin-top:10px;width:540px;Height:50px;-webkit-border-radius:10px;-moz-border-radius:10px;Border-radius:10px; }. DB{width:100px;Height:50px;Background-color:#fff;-webkit-border-radius:10px;-moz-border-radius:10px;Border-radius:10px;Border:1px solid Red;float: Left;Margin-left:5px;Line-height:50px;text-align:Center; /*color:red;*/ } </style></Head><Body><inputtype= "button"value= "Start"ID= "Start"/><DivID= "All"> <Div>Xiao ming</Div> <Div>Little Red</Div> <Div>Trabecula</Div> <Div>Lao Wang</Div> <Div>Little Green</Div></Div><Scriptsrc= "Common.js"></Script><Script> //add a style to the div in all vardivs=my$ (" All"). getElementsByTagName ("Div"); for (varI= 0; I<divs.length; I++) {Divs[i].classname= "DB"; } //Roll Callmy$ ("Start"). onclick= function () { if ( This. Value== "Start") { This. Value= "Stop";Timeid=SetInterval (function () { for (varI= 0; I<divs.length; I++) {Divs[i].style.backgroundcolor= ""; Divs[i].style.color= ""; }Divs[parseint (Math.random ()*Divs.length)]. Style.backgroundcolor= "Red"; }, -) } Else { //Clear Timerclearinterval (Timeid); This. Value= "Start"; } };</Script></Body></HTML>
Common.js Code
function my$ (ID) { return document.getElementById (ID);}
JavaScript simple random Name System