js自动创建div每秒创建一个div，div由a-z创建，穿建到z时结束创建，并让div内的颜色随机变化

本文链接：https://blog.csdn.net/qq_45858540/article/details/107831220

<!DOCTYPE html>
<html>

<head>
	<title>页面效果</title>`
	<style>
		.dv {
			display: inline-block;
			width: 80px;
			height: 80px;
			border: 2px solid #000;
			border-radius: 5px;
			font-size: 25px;
			text-align: center;
			line-height: 80px;

		}
	</style>

</head>

<body>

</body>

<script>
	var num = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z']
	var a = 0
	//var count=65
	var js = setInterval(function () {
		//创建一个div

		var div = document.createElement('div');

		div.className = 'dv'//为div创建属性class = "dv"	
		div.innerHTML = num[a++]
		// div.innerHTML = String.fromCharCode(count++)
		document.querySelector("body").appendChild(div)
		aa()
		// if (count<92) 
		if (a >= 26) {
			clearInterval(js)
		}

	}, 1000)//js创建div,每隔一秒创建一个


	function aa() {

		var b = document.querySelectorAll('.dv');
		var a = Math.floor(Math.random() * b.length);
		b[a].style.background = bb()
		setTimeout("aa()", 1000);//每隔一秒后重新运行，定时器

	}
	function bb(){
		var hex = Math.floor(Math.random() * 16777216).toString(16);
		while (hex.length < 6) {
			hex = '0' + hex;
		}
		hex='#'+hex
		return hex
	}//随机颜色


</script>

</html>