可以使用JavaScript来动态改变元素的背景图,以下是一个示例代码:

HTML部分:
html

CSS部分:
css
#myDiv {
width: 200px;
height: 200px;
background-image: url("默认背景图.jpg");
background-size: cover;
}

JavaScript部分:
javascript
var myButton = document.getElementById("myButton");
var myDiv = document.getElementById("myDiv");
var backgroundImageIndex = 1;
var backgroundImageList = ["背景图1.jpg", "背景图2.jpg", "背景图3.jpg"];

myButton.addEventListener("click", function() {
myDiv.style.backgroundImage = "url(" + backgroundImageList[backgroundImageIndex] + ")";
backgroundImageIndex++;
if (backgroundImageIndex >= backgroundImageList.length) {
backgroundImageIndex = 0;
}
});

在这个代码中,我们首先获取了按钮元素和需要改变背景图的div元素,同时定义了一个变量`backgroundImageIndex`来记录当前使用的背景图索引,以及一个背景图列表`backgroundImageList`。

接着我们给按钮添加了一个点击事件监听器,当按钮被点击时,会切换div元素的背景图。我们通过修改div元素的`style`属性中的`backgroundImage`来实现背景图的切换。切换时,我们将`backgroundImageIndex`加一,然后判断是否已经超过了背景图列表的长度,如果超过了,则将`backgroundImageIndex`重置回0,从第一个背景图开始循环切换。