用js怎样写一个随机点名器?
Admin 2021-05-25 群英技术资讯 1843 次浏览
老师在课堂上,经常会随机点名学生回答问题,我们现在学习了JavaScript,那么怎样用JS来实现一个随机点名器呢?下面小编就给大家分享一个实现简单的随机点名器的代码,感兴趣的朋友就继续往下看吧。
效果:

代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
.box{
width:300px;
height:200px;
border:1px solid #ccc;
/*position: absolute;
left:0;
right:0;
top:0;
bottom:0;
margin: auto;*/
margin: 100px auto;
text-align: center;
}
h1{
width:150px;
height:60px;
line-height: 60px;
text-align: center;
font-size: 30px;
background-color: red;
margin: 10px auto;
}
button{
width:100px;
height:40px;
background-color: dodgerblue;
border:0;
font-size: 24px;
color:#fff;
}
</style>
</head>
<body>
<div class="box">
<h1></h1>
<button>开始</button>
<button>停止</button>
</div>
<script>
var h1=document.getElementsByTagName('h1')[0];
var btn=document.getElementsByTagName("button");
var arr=["苏晨旭","张志阳","小明","社会坤哥","药","敬珍","锦涛","网管","社会辰哥","渣男","雪","宝贝曼","大个","睡神","龙爷","英儿","东北娃","珂珂","黄花大闺女","狗蛋",
"狗子","天娇","志强","晋玮","海涛","迈姐","新凤","环姐","二狗"];
var ind=ranFun(0,arr.length-1)
h1.innerHTML=arr[ind];
var timer;
btn[0].onclick=function(){
clearInterval(timer)
timer=setInterval(function(){
h1.innerHTML=arr[ranFun(0,arr.length-1)]
},100)
}
btn[1].onclick=function(){
clearInterval(timer)
}
function ranFun(a,b){
return Math.floor(Math.random()*(b-a+1)+a)
}
</script>
</body>
</html>
以上就是关于JS实现随机点名的代码介绍了,上文有具体的代码,需要的朋友可以参考学习,希望大家阅读完这篇文章能有所收获。
文本转载自脚本之家
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:mmqy2019@163.com进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容。
猜你喜欢
reduce()方法对数组中的每个元素执行一个reducer函数,并将其结果总结为单个返回值。它接收两个参数,一个reducer函数提供给数组的每个调用,一个可选的初始值参数。
这篇文章主要给大家分享了 vue中install方法介绍,vue提供install可供我们开发新的插件及全局注册组件等,感兴趣的小伙伴请和小编一起进入文章了解具体内容吧</P><P>
现在很多网站很软件都添加了短信验证的功能,我们在使用时发现一般获取一次验证码之后,需要等待一段时间才能获取下一次验证码,那么发送短信验证间隔是如何实现呢?这篇文章就主要介绍使用js实现短信验证码倒计时功能。
这篇文章主要介绍了vue储存storage时含有布尔值的解决方案,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
本文主要介绍了JavaScript如何用面向对象的方式封装拖拽对象,通过3种方式来实现,帮助读者更好的理解其原理
成为群英会员,开启智能安全云计算之旅
立即注册关注或联系群英网络
7x24小时售前:400-678-4567
7x24小时售后:0668-2555666
24小时QQ客服
群英微信公众号
CNNIC域名投诉举报处理平台
服务电话:010-58813000
服务邮箱:service@cnnic.cn
投诉与建议:0668-2555555
Copyright © QY Network Company Ltd. All Rights Reserved. 2003-2020 群英 版权所有
增值电信经营许可证 : B1.B2-20140078 ICP核准(ICP备案)粤ICP备09006778号 域名注册商资质 粤 D3.1-20240008