J25 摇车牌 - 掘金

<!DOCTYPE html>
<html>

<head>
	<meta charset="UTF-8">
	<title>摇车牌</title>
	<!-- IMPORT CSS -->
	<style>
		.licensePlate {
			box-sizing: border-box;
			padding: 0 10px;
			width: 200px;
			height: 40px;
			line-height: 40px;
			background: lightblue;
			font-size: 20px;
		}
	</style>
</head>

<body>
	<div class="box">
		<p class="licensePlate"></p>
		<button class="shakeBtn">摇号</button>
	</div>

<!-- IMPORT JS -->
<script>
let licensePlate = document.querySelector('.licensePlate'),
	shakeBtn = document.querySelector('.shakeBtn');

let count = 0;
shakeBtn.onclick = function () {
	// 1.限制次数
	count++;
	if (count >= 4) {
		alert('只能摇号三次，您已经摇过三次了！');
		return;
	}
	// 2.随机生成车牌号，放置到页面指定容器中
	let result = '京',
		area1 = 'ABCEFGHJK', //=>索引范围0~8
		area2 = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789'; //=>索引范围0~35
	result += area1.charAt(Math.round(Math.random() * 8));
	for (let i = 1; i <= 5; i++) {
		result += area2.charAt(Math.round(Math.random() * 35));
	}
	licensePlate.innerHTML = result;
};		
</script>
</body>

</html>