1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>点名器</title>
6 <style type="text/css">
7 *{
8 margin: 0;
9 padding: 0;
10 }
11 #outer{
12 margin: 50px;
13 padding: 50px;
14 width: 600px;
15 /*height: 600px;*/
16 border-radius: 20px;
17 background-color: orange;
18 }
19 #box{
20 margin-top: 20px;
21 padding: 20px;
22 background-color:grey;
23 font-size: 40px;
24 font-weight: bold;
25 }
26 #bt{
27 width: 80px;
28 margin-top:5px;
29 padding: 10px;
30 background-color: green;
31 font-size: 20px;
32 font-weight: bold;
33 cursor: pointer;
34 }
35
36 </style>
37 </head>
38 <body>
39 <center>
40 <<div id="outer">
41 <div id="box"></div>
42 <button type="button" id="bt">start</button>
43 </div>
44 </center>
45
46 <script type="text/javascript">
47 var namelist=["梅西","内马尔","苏亚雷斯","伊列斯塔","布斯克茨","皮克","罗贝托","拉基蒂奇","马斯切拉诺"]
48 var flag=0;
49 var bt=document.getElementById("bt");
50 var box=document.getElementById("box")
51 bt.onclick=function(){
52 if(flag==0){
53 flag=1;
54 bt.innerHTML="stop";
55 bt.style.backgroundColor="red";
56 show();
57 }
58 else{
59 bt.innerHTML="start";
60 bt.style.backgroundColor="green";
61 clearTimeout(flag);
62 flag=0;
63 }
64
65 }
66 function show(){
67 var num=Math.floor(Math.random()*1000)%namelist.length;
68 box.innerHTML=namelist[num];
69 flag=setTimeout("show()",100);
70 }
71 </script>
72 </body>
73 </html>
时间： 2024-08-27 14:34:26