<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
#p1{
width: 400px;
height: 200px;
color: lavenderblush;
background-color: red;
text-align: center;
line-height: 200px;
font-size: 300%;
font-family: "华文行楷";
}
#b1{
width: 100px;
height: 50px;
text-align: center;
margin-left: 120px;
}
</style>
</head>
<body>
<p id="p1">开始点名</p>
<button id="b1">开始</button>
</body>
<script>
var a=['李XX','熊XX','张XX','严XX','龚XX','章XX','郑XX','吴XX','李XX','罗XX'];
var op = document.getElementById("p1");
var oBtn = document.getElementById("b1");
var start;
var n = true;
function first(){
start = setInterval(function(){
for(var i=0;i<a.length;i++){
var num = parseInt(Math.random()*a.length);
op.innerHTML = a[num];
}
},100)
}
function end(){
clearInterval(start);
}
oBtn.onclick = function(){
if(n == true){
n=false;
oBtn.innerHTML="停止";
first();
}else if(n == false){
n = true;
oBtn.innerHTML="开始";
end();
}
}
</script>
</html>
html制作点名器
猜你喜欢
转载自blog.csdn.net/weixin_43888806/article/details/84679237
今日推荐
周排行