web点名录
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/4654296f18f7759e2aa66be1e8aa99a0.png)
```javascript
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>点名录</title>
<style type="text/css">
h2{
color: red;
font-family: "楷体";
font-size: 30px;
}
#mydiv{
margin: 0 auto;
width: 600px;
height: 240px;
border: 1px solid firebrick;
text-align: center;
font-size: 130px;
}
#mybut{
display: block;
margin: 20px auto;
font-size: 18px;
background-color: deepskyblue;
color: white;
}
</style>
<script src="js/jquery-3.4.1.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<h1 align="center">B160401班开始点名</h1>
<h2 align="center">被点到姓名的是</h2>
<div id="mydiv">
</div>
<div id="btdiv">
<button id="mybut" onclick="start()">开始</button>
</div>
<script type="text/javascript">
var names=["莲","高婷","吴美","周玲","高香","郝军","慧","琪","龙祁","李伟",
"王珍","王乾","王森","陈明","陈星","陈辉","王召","祝云","胡涛","浩","欧辉","张琪","宋朝",
"郑峰","田孝","张浩","王逸","覃恩","董庚","高阳","瑞","凌乔"];
var flag=0;
function start(){
var ranNum=Math.floor(Math.random()*32);
var divNum=names[ranNum];
$('#mydiv').html(divNum);
$('#mybut').html('停止').attr('onclick','stopbut()');
flag=setTimeout(start,80);
}
function stopbut(){
clearTimeout(flag);
var n=$('#mydiv').html();
names.splice(names.indexOf(n),1);
$('#mybut').html('开始').attr('onclick','start()');
}
</script>
</body>
</html>