js做个随机点名的小游戏

用JavaScript做个随机点名的小游戏，用一个开关控制点名程序的开始与暂停

<!DOCTYPE html>
<html lang="zh"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>随机点名</title><script src="./js/plugins/simditor/jquery.min.js" type="text/javascript" charset="utf-8"></script></head><style type="text/css">#name_div,#name_wrap {font-family: STXingkai;}#name_div {font-size: 48px;}#name_wrap span {margin: 10px;}</style><body><div id="Gallery"><div id="name_wrap"></div><div id="name_div"></div><button type="button" id="switch_btn">start</button></div><script type="text/javascript">var timer = null;var data = ['王小明', '张小三', '王二狗', '钱小五', '孙小萌', '刘二柱'];var str = ''for (let name of data) {str += "<span>" + name + "</span>"};document.getElementById("name_wrap").innerHTML = str;document.getElementById("switch_btn").onclick = function() {var btn_text = document.getElementById("switch_btn").innerHTML;switch (btn_text) {case 'start':document.getElementById("switch_btn").innerHTML = 'stop'timer = setInterval(function() {var index = (Math.random() * (data.length - 1)).toFixed(0)document.getElementById("name_div").innerText = '今晚吃火锅谁请客:' + data[index]}, 20)break;case 'stop':document.getElementById("switch_btn").innerHTML = 'start'clearInterval(timer)break;default:break;}}</script></body>
</html>

效果截图:

js做个随机点名的小游戏相关推荐

用JS做了一个贪吃蛇小游戏,求顶贴..
这个周JS课程也快结束了,昨天下午琢磨着做一个小游戏,于是,这个小东东就这么诞生了,目前还存在两个小BUG,欢迎各位高手指正.... 实现的效果有: W,A,S,D,经及小键盘方向键控制方向; 头碰到 ...
js做的一个猜数字小游戏
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8" ...
做一个简单的java小游戏--单机版五子棋
做一个简单的java小游戏–单机版五子棋学了java有一段时间了,今天就来搞一个简单的单机版五子棋游戏. 实现功能:那必须能进行基础的输赢判断.还有重新开始的功能,悔棋的功能,先手设置的功能和退出的 ...
python拿什么做可视化界面好-手把手教你用Python做个可视化的“剪刀石头布”小游戏...
/1 前言/ 最近在学习PyQt5可视化界面,这是一个内容非常丰富的gui库,相对于tkinter库,功能更加强大,界面更加美观,操作也不难.于是我开始小试牛刀,用PyQt5做个可视化的"剪 ...
我的小白同事接触白鹭引擎4天，成功做了一款足球小游戏
写在前面:我的同事"熊猫少女"刚刚入职白鹭,之前从未接触过白鹭引擎,也从未做过游戏,经过4天时间的学习,他成功做了一款足球小游戏,这篇文章主要是记录他的开发过程: 正文如下: 在接 ...
用原生javascript做的一个打地鼠的小游戏
学习javascript也有一段时间了,一直以来分享的都是一些概念型的知识,今天有空做了一个打地鼠的小游戏,来跟大家分享一下,大家也可以下载来增加一些生活的乐趣,下面P出代码:首先是HTML部分代码: ...
HTML+CSS+JS实现网页随机点名
HTML+CSS+JS实现网页随机点名大家好,我是小王,一个很喜欢Coding的小女孩. 很喜欢这句话:人数没有白走的路,每一步都算数,关注我,后期分享更多资源! 效果如下: 部分代码如下: < ...
用pygame做一个简单的python小游戏---贪吃蛇
用pygame做一个简单的python小游戏-贪吃蛇贪吃蛇游戏博客链接:(方法一样,语言不一样) c++贪吃蛇:https://blog.csdn.net/weixin_46791942/artic ...
用pygame做一个简单的python小游戏---七彩同心圆
用pygame做一个简单的python小游戏-七彩同心圆这个小游戏原是我同学python课的课后作业,并不是很难,就简单实现了一下,顺便加强一下pygame库的学习. 玩法:每次点击鼠标时,会以鼠标 ...

js做个随机点名的小游戏

用JavaScript做个随机点名的小游戏，用一个开关控制点名程序的开始与暂停

效果截图:

js做个随机点名的小游戏相关推荐

最新文章

热门文章