获取背景图像数组以保存以备后用，然后在它们和背景颜色之间切换鼠标悬停

<div id="background-element"></div>

#background-element {
  width: 500px;
  height: 300px;
  background-color: #ccc;
  background-image: url('default.jpg');
  background-size: cover;
  transition: background-image 0.5s ease;
}

// 背景图像数组
var backgroundImageArray = [
  'image1.jpg',
  'image2.jpg',
  'image3.jpg'
];

var backgroundElement = document.getElementById('background-element');
var currentIndex = 0;

// 鼠标悬停时切换背景图像和背景颜色
backgroundElement.addEventListener('mouseover', function() {
  currentIndex = (currentIndex + 1) % backgroundImageArray.length;
  var nextImage = backgroundImageArray[currentIndex];
  backgroundElement.style.backgroundImage = 'url(' + nextImage + ')';
});

backgroundElement.addEventListener('mouseout', function() {
  backgroundElement.style.backgroundImage = 'url(default.jpg)';
});