原生JavaScript随机点名表

最新推荐文章于 2022-10-08 12:49:50 发布

栋栋很优秀啊

最新推荐文章于 2022-10-08 12:49:50 发布

阅读量419

点赞数 2

分类专栏： html JavaScript 文章标签： html javascript html5

本文链接：https://blog.csdn.net/dongdongaa0/article/details/112506455

版权

html 同时被 2 个专栏收录

18 篇文章 0 订阅

订阅专栏

JavaScript

16 篇文章 0 订阅

订阅专栏

效果：

在这里插入图片描述

代码：

<!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>

栋栋很优秀啊

关注

2
点赞
踩
4

收藏

觉得还不错? 一键收藏
4
评论
原生JavaScript随机点名表

效果：代码：<!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;
复制链接

扫一扫