一个比较有趣的小网页，又做的不好的地方，请大佬们指出来

最新推荐文章于 2024-09-08 21:17:37 发布

眼红的小孩

最新推荐文章于 2024-09-08 21:17:37 发布

阅读量49

点赞数

文章标签： javascript css html5

本文链接：https://blog.csdn.net/qq_63480508/article/details/131436254

版权

	<style>
		body {
			background-color: darksalmon;
		}
		div {
			width: 100px;
			height: 100px;
			border: 1px solid #000;
			display: inline-block;
			line-height: 80px;
			text-indent: 20px;
			margin: 50px 20px;
		}
		/*div的触摸事件*/
		div:hover {
			background-color: lightsalmon;
			transition-duration: 3s;
			opacity: 0.6;
		}
	</style>
	<body>
		<div>天明</div>
		<div>css</div>
		<div>js</div>
		<div>html</div>
		<div>css</div>
		<div>js</div>
		<div>html</div>
		<div>css</div>
		<div>js</div>
		<div>html</div>
		<div>css</div>
		<div>js</div>
		<div>html</div>
		<div>css</div>
		<div>jquery</div>
		<div>Es6</div>
		<div>Bootstop</div>
		<div>jquery</div>
		<div>Es6</div>
		<div>Bootstop</div>
		<div>jquery</div>
		<div>Es6</div>
		<div>Bootstop</div>
		<div>jquery</div>
		<div>Es6</div>
		<div>Bootstop</div>
		<div>jquery</div>
		<div>Es6</div>
		<div>Bootstop</div>
		<div>Bootstop</div>

		<script>
			//获取div元素
			    var divs = document.querySelectorAll("div");
			//设置定时器
			    setInterval(function () {
				//设置循环
				  for (var i = 0; i < divs.length; i++) {
					divs[i].style.backgroundColor = "lawngreen";
		    	//判断根据自己的需求
					if (i == 1) {
						//给div加一个背景颜色为红色,后面也是但是就是变了一下颜色;
						divs[i].style.backgroundColor = "red";
					}
					if (i == 4) {
						divs[i].style.backgroundColor = "gold";
					}
					if (i == 12) {
						divs[i].style.backgroundColor = "cyan";
					}
					if (i == 15) {
						divs[i].style.backgroundColor = "navy";
					}
					if (i == 18) {
						divs[i].style.backgroundColor = "steelblue";
					}
					if (i == 21) {
						divs[i].style.backgroundColor = "orange";
					}
					if (i == 24) {
						divs[i].style.backgroundColor = "yellow";
					}
					if (i == 26) {
						divs[i].style.backgroundColor = "purple";
					}
					if (i == 28) {
						divs[i].style.backgroundColor = "indigo";
					}
					if (i == 30) {
						divs[i].style.backgroundColor = "gray";
					}
					//让里面的元素又变成初始值
					setTimeout(function () {
						location.reload();
					}, 1000);
				}
			}, 1000);
		</script>
	</body>
</html>