<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style type="text/css">
*{
margin: 0;
padding: 0;
}
body{
text-align: center;
}
div{
margin-top: 200px;
}
p{
font-family: 'Courier New', Courier, monospace;
margin-bottom: 6px;
font-size: 16px;
}
p span{
color: hotpink;
}
label{
display: block;
width: 50px;
height: 50px;
margin: 0 auto;
border-width: 1px;
border-style: solid;
border-radius: 5px;
font-size: 16px;
border-color: black;
color: hotpink;
line-height: 50px;
}
button{
margin-top: 4px;
width: 50px;
}
</style>
</head>
<body>
<div>
<p>今天的获奖嘉宾是<span>⬇⬇</span></p>
<label></label>
<button id="btn">开始</button>
</div>
</body>
<script>
var list=["龚","唐","嫒","好","赖","彤"]
var btn=document.getElementById("btn")
var label=document.getElementsByTagName("label")
var time,timer
btn.οnclick=function(){
if(btn.innerText=="开始"){
btn.innerText="停止"
timer=setInterval(fn,100),time=1
function fn(){
for(var i=0;i<list.length;i++){
if(time%list.length==i)
label[0].innerText=list[i]
}
time++
}
}
else{
btn.innerText="开始"
clearInterval(timer)
}
}
</script>
</html>
QQ录屏20221127153622
2916
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
