javascript 实现简单点名器

最新推荐文章于 2024-04-24 18:14:24 发布

唐小白成长记

最新推荐文章于 2024-04-24 18:14:24 发布

阅读量2k

点赞数 2

分类专栏： javascript 文章标签： javascript 点名器

本文链接：https://blog.csdn.net/tangyue1997/article/details/90813004

版权

javascript 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<style>
	#box{
		width: 400px;
		height: 400px;
		border: 1px solid #2bf666;
		margin: 0px auto;
		line-height: 400px;
		text-align: center;
	}
	#fan{
		margin: 50px auto;
		cursor: pointer;
		width: 100px;
		height: 100px;
	}
</style>
<body>
	<div id="box">
			点名器
	</div>
	<div id='fan'>
		开始翻牌
	</div>
	
</body>
<script>
	//获取对象
	box = document.getElementById('box');
	fan = document.getElementById('fan');
	

	//定义一个数组
	var arr = ['张三','李四','武超','范冰冰','李晨','想哥','小叶','庞红'];

	//声明一个timmer  用来消除定时器
	timmer = null;
	fan.onclick =function()
	{	
		fan.innerHTML ='停止翻牌';
		//随机数
		function rand(m,n)
		{
			return Math.ceil(Math.random()*(n-m+1))+m-1;
		}
		//统计数组长度
		a = arr.length;
		if(timmer == null)
		{
			timmer = setInterval(function(){
				box.innerHTML =arr[rand(1,a)-1]
			},100);
		}else{
			clearInterval(timmer);
			timmer = null;
			fan.innerHTML ='开始翻牌';

		}
		
	}
	
	
</script>
</html>

唐小白成长记

关注

2
点赞
踩
4

收藏

觉得还不错? 一键收藏
0
评论
javascript 实现简单点名器

<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><style> #box{ width: 400px; height: 400px; borde...
复制链接

扫一扫