随机抽数 

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<style type="text/css">
		.box {
			width: 200px;
			height: 100px;
			border: 1px solid sienna;
			display: flex;
			align-items: center;
			font-size: 24px;
			justify-content: space-evenly;
			align-content: center;
		}
	</style>

	<body>
		<div class="box">姓名</div>
		<button>点击</button>
	</body>

</html>
<script>
	var name2 = document.querySelector(".box"); 
	var butt1 = document.querySelector("button");
	var query = null; //定义一个空变量
	butt1.onclick = function() {
		if(butt1.innerHTML == "开始") {
			butt1.innerHTML = "停止";
			query = setInterval(function() {
				aa()
			}, 100);
		} else {
			butt1.innerHTML = "开始";
			clearInterval(query); //停止定时器
		}
	};

	function aa() {
		var anarray = ["11", "22", "33", "44"];
		var colors = ["yellow", "red", "green", "aqua", ];
		var user1 = Math.round(Math.random() * anarray.length - 1); //获取随机数
		var concent = Math.round(Math.random() * colors.length - 1); //获取随机数
		 
		name2.innerHTML = anarray[user1];
		name2.style.color = colors[concent];
	}
</script>

　　

posted @ 2022-01-10 16:41  多肉丸子  阅读(125)  评论(0)    收藏  举报