<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.form{
width: 150px;
height: 150px;
margin: 0 auto;
border: 1px solid black;
}
.text{
width: 150px;
height: 120px;
background-color: #bff6ff;
font-size: 25px;
line-height: 120px;
text-align: center;
}
button{
width: 150px;
height: 30px;
}
</style>
</head>
<body>
<div class="form">
<div class="text">
点击按钮点名
</div>
<button>随机点名</button>
</div>
<script>
var stus = [];
var count = 10;
for(var i = 0; i < count; i++){
stus[i] = "学生" + (i + 1);
}
document.querySelector("button").onclick = function (){
var random = parseInt(Math.random() * stus.length);
document.querySelector(".text").innerText = stus[random];
stus.splice(random,1);
if (stus.length == 0){
this.disabled = true;
document.body.firstElementChild.lastElementChild.innerHTML = "点名完毕";
}
}
</script>
</body>
</html>
JavaScript实现随机点名
最新推荐文章于 2023-08-17 19:54:28 发布