使用js做出简单的轮播图效果（新手篇）

setInterval
具体使用为setInterval（执行的函数，时间），例如setInterval（fn(),1s），每经过一秒执行一次fn函数。
实现思想
先将图片地址保存在数组中，然后使用定时器setInterval实现自动切换以及使用点击事件实现点击小圆点切换图片。

<script type="text/javascript">
			window.onload = function() {
				let imga = ["url(./img/1.jpg)", "url(./img/2.jpg)", "url(./img/3.png)", "url(./img/4.jpg)", "url(./img/5.jpg)"]
				let i = 1
				let bgc = document.querySelector(".bgc")
				setInterval(function() {
					bgc.style.transition = "1s"
					bgc.style.backgroundImage = imga[i]
					i++
					if (i == 5) {
						i = 0
					}

				}, 3000)

				let indexa = ["#c1120f", "rgb(31, 158, 255)", "rgb(243, 239, 253)", "rgb(69, 177, 213)", "rgb(255, 134, 177)"]
				let j = 1
				let index = document.querySelector(".index")
				setInterval(function() {
					index.style.transition = "1s"
					index.style.backgroundColor = indexa[j]
					j++
					if (j == 5) {
						j = 0
					}

				}, 3000)
				
				let bnt=document.querySelectorAll(".disc>li")
				for(let i=0;i<bnt.length;i++){
					bnt[i].onclick=function(){
						bgc.style.transition = "1s"  //切换图片的动画效果，1s完成
						bgc.style.backgroundImage = imga[i]
						index.style.transition = "1s"  //切换图片的动画效果，1s完成
						index.style.backgroundColor = indexa[i]
					}
				}
			}
		</script>

没错，轮播图就是这么简单！