如何让"onmousemove“在不同的div上切换图片？

<div id="div1"></div>
<div id="div2"></div>
<div id="div3"></div>

document.onmousemove = function(event) {
  var x = event.clientX; // 获取鼠标的水平位置
  var y = event.clientY; // 获取鼠标的垂直位置

  // 根据鼠标位置判断当前所在的div
  if (x < 200 && y < 200) {
    // 鼠标在div1上
    document.getElementById("div1").style.backgroundImage = "url('image1.jpg')";
  } else if (x < 400 && y < 400) {
    // 鼠标在div2上
    document.getElementById("div2").style.backgroundImage = "url('image2.jpg')";
  } else {
    // 鼠标在div3上
    document.getElementById("div3").style.backgroundImage = "url('image3.jpg')";
  }
};

div {
  width: 200px;
  height: 200px;
  background-color: #ccc;
}