使用JS操作CSS实现JS改变背景图片

使用JS操作CSS实现JS改变背景图片

在写一个后台管理系统的界面时候，想要实现每次刷新界面或者访问界面时候会重新加载一张图片并且每次都不一样，于是乎就去想了个方法去实现它，最终方案是通过js来改变div的css属性来实现改变页面背景。
1、上传图片
通过图床上传几张图片到网络上，这样就可以不用在本地获取图片了，然后你会得到你的图片的URL，接着进行下一步

2、改变div的url

<div class="main-bg" id="divBg"> //注意，你的js代码一定要等html代码加载完成再对其进行修改url，否则你将会无法获取对应的div节点

<script>
	var arr=['https://ftp.bmp.ovh/imgs/2021/03/f9123a689d2b729b.jpeg',
			'https://ftp.bmp.ovh/imgs/2021/03/77a499a26d6a9cc9.jpg',
			'https://ftp.bmp.ovh/imgs/2021/03/0c16f2ad8d1dfb1d.jpg',
			'https://ftp.bmp.ovh/imgs/2021/03/d8e43cd5a5be130d.jpg',
			'https://ftp.bmp.ovh/imgs/2021/03/4fb974fafbedf2ad.jpg',
			'https://ftp.bmp.ovh/imgs/2021/03/86c2b9913133d49e.jpg',
			'https://ftp.bmp.ovh/imgs/2021/03/40be5be806057b00.jpg']
	var images=arr[parseInt(Math.random()*arr.length-1)]
	document.getElementById("divBg").style.backgroundImage="url("+images+")";
</script>