JS实现随机点名系统
更新时间：2021年04月02日 11:05:12 作者：乘风破浪的程序媛
这篇文章主要为大家详细介绍了JS实现随机点名系统，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
用JS实现一个随机点名系统，供大家参考，具体内容如下
每次上课前10分钟，老师都会叫我们回答问题，奈何每次都是点学号，好像每次我都能中奖，我直接跟老师提议，老师，我用来JS来帮你写个随机点名的系统吧！这样就不会每次都抽到我了，哈哈
先看效果：
代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<button id="box1">开始</button>
<button id="box2">结束</button>
<span id="box">Tom</span>
<script>
//获取页面中的元素
var btn1 = document.getElementById('box1');
var btn2 = document.getElementById('box2');
var span = document.getElementById('box');
var names = ['Tom', 'Jack', 'Lucy', 'Peter', 'Mark', 'Min', 'Liu', 'Rani'];
var timer;
btn1.onclick = function() {
window.clearInterval(timer);
timer = window.setInterval(countName, 100);
};
btn2.onclick = function() {
window.clearInterval(timer);
};
function countName() {
var index = parseInt(Math.random() * names.length);
span.innerHTML = names[index];
}
</script>
</body>
</html>
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。
相关文章
js中toString()函数与valueOf()函数使用与区别
在等于运算符中，如果比较的内容包含对象类型数据，则会涉及隐式转换，那么就会调用toString()函数和valueOf()函数，本文主要介绍了 js中toString()函数与valueOf()函数使用与区别，感兴趣的可以了解一下2022-04-04
这篇文章主要介绍了微信小程序使用radio显示单选项功能,涉及针对radio组件事件响应相关操作技巧,并附带源码供读者下载参考,需要的朋友可以参考下2017-12-12
本文主要介绍了JavaScript平铺数组转树形结构的实现示例，文中通过示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-07-07
这篇文章主要为大家详细介绍了微信小程序tabBar底部导航中文注解api，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-08-08
js通过var定义全局变量与在window对象上直接定义属性的区别说明
这篇文章主要介绍了js通过var定义全局变量与在window对象上直接定义属性的区别说明，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-09-09
对于没有中划线的css属性一般直接使用style.属性名即可，对于含有中划线的css属性，将每个中划线去掉并将每个中划线后的第一个字符换成大写即可，感兴趣的朋友可以参考下2013-09-09
这篇文章主要介绍了Object.keys 诡异特性示例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-10-10
下面小编就为大家带来一篇NodeJS的Promise的用法解析。小编觉得挺不错的，现在分享给大家，也给大家做个参考2016-05-05
这篇文章主要介绍了js实现按钮控制图片360度翻转特效的方法,涉及HTML5中canvas方法的使用技巧,具有一定参考借鉴价值,需要的朋友可以参考下2015-02-02
这篇文章主要介绍了基于JS实现页面悬浮框的实例代码,代码简单易懂，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2021-12-12
最新评论