换背景图代码

我若成魔，佛赖我何，我就是程序狂魔

于 2022-06-23 15:28:13 发布

阅读量293

点赞数 2

本文链接：https://blog.csdn.net/wangmengsasa/article/details/125427916

版权

大数据

HTML代码

        <div class="beijing">
			<img src="img/1.jpg" alt="">
			<img src="img/2.jpg" alt="">
			<img src="img/3.jpg" alt="">
		</div>

JS代码

            // 获取元素图片
			let imgs=document.querySelectorAll('.beijing img');
			//循环图片
			for(i=0;i<imgs.length;i++){
				//给每个图片添加点击事件
				imgs[i].onclick=function(){
					//设定图片路径就是当时所点击的图片路径
					let src=this.src;
					//点击更换背景图
					document.body.style.backgroundImage='url('+src+')'
					//图片大小覆盖body
					document.body.style.backgroundSize='cover'
					//cover是覆盖的意思
				}
			}