centerdiv id=div_1 style=width 800px;height 100;border 10px solid pink;img src=img1jpgimg src=imgzfmjpgimg src=img抽奖图片pngimg src=img鸭子图片jpgdivcenter帮我为这个写一个js使div两边有箭头用于切换图片这个是img的样式img width800px;

你可以使用JavaScript来实现切换图片的功能。以下是一个示例代码：

// 获取div元素
var div = document.getElementById("div_1");

// 获取所有的图片元素
var images = div.getElementsByTagName("img");

// 设置初始索引
var currentIndex = 0;

// 显示当前索引的图片
function showCurrentImage() {
  for (var i = 0; i < images.length; i++) {
    if (i === currentIndex) {
      images[i].style.display = "block";
    } else {
      images[i].style.display = "none";
    }
  }
}

// 切换到上一张图片
function previousImage() {
  currentIndex--;
  if (currentIndex < 0) {
    currentIndex = images.length - 1;
  }
  showCurrentImage();
}

// 切换到下一张图片
function nextImage() {
  currentIndex++;
  if (currentIndex >= images.length) {
    currentIndex = 0;
  }
  showCurrentImage();
}

// 添加点击事件监听器
div.addEventListener("click", function(event) {
  var arrowClicked = event.target;
  if (arrowClicked.id === "left-arrow") {
    previousImage();
  } else if (arrowClicked.id === "right-arrow") {
    nextImage();
  }
});

// 初始化显示第一张图片
showCurrentImage();

在上面的代码中，我们首先获取到包含图片的div元素，并获取所有的图片元素。然后，我们定义了两个函数previousImage和nextImage用于切换图片。这两个函数会根据当前的索引来显示对应的图片，并更新索引值。最后，我们添加了一个点击事件监听器，当点击箭头时，调用相应的函数来切换图片。最后，我们调用showCurrentImage函数来初始化显示第一张图片。

为了实现希望的效果，你还需要在HTML中添加两个箭头元素，并给它们分别添加id属性为"left-arrow"和"right-arrow"。例如：

<div id="div_1" style="width: 800px;height: 100%;border: 10px solid pink;">
  <img src="../../img/1.jpg"/>
  <img src="../../img/zfm.jpg"/>
  <img src="../../img/抽奖图片.png">
  <img src="../../img/鸭子图片.jpg">
  <img id="left-arrow" src="left-arrow.png">
  <img id="right-arrow" src="right-arrow.png">
</div>

请注意，你需要将箭头图片的路径修改为实际的路径，并确保箭头图片的id与代码中的对应