JavaScript 一个简易的点名系统

目录

一，先写一个大概的主体

二，用css美化主体，让代码看起来更加的美观

三， 用JavaScript语法实现效果

1.定义一个数组

2.获取元素

3.用随机函数生成下标进行索引，并向下取整

4.因为是动态的所以给它设置一个定时器

5.函数+if else+计时器+打标记

四，全部代码展示及其效果图展示

---

一，先写一个大概的主体

		<div class="box">
			  <div id="realname">???</div>
			  <button onclick="call()" id="btn">开始</button>
		</div>

二，用css美化主体，让代码看起来更加的美观

		<style type="text/css">
			.box{
				width: 200px;
				margin: auto;
				margin-top: 20px;
			}
			.box div{
				background: goldenrod;
				color: #fff;
				width: 100%;
				height: 80px;
				text-align: center;
				line-height: 80px;
				font-size: 18px;
			}
			.box button{
				width: 100%;
				height: 35px;
				text-align: center;
				margin-top: 10px;
				border: 0px;
				background: blue;
				color: #fff;
			}
			
		</style>

三， 用JavaScript语法实现效果

1.定义一个数组

var realnames = ["张三","李四","赵六","王五","陆七","王二麻","狗剩"];

2.获取元素

			var realname  = document.getElementById("realna