javascript实现图片轮播

可以使用以下代码实现简单的图片轮播：

HTML 代码：

<div class="slider">
  <img src="image1.jpg" alt="Image 1">
  <img src="image2.jpg" alt="Image 2">
  <img src="image3.jpg" alt="Image 3">
</div>

CSS 代码：

.slider {
  position: relative;
}
.slider img {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}
.slider img.active {
  opacity: 1;
}

JavaScript 代码：

const images = document.querySelectorAll('.slider img');
let index = 0;

function showImage() {
  images.forEach(img => img.classList.remove('active'));
  images[index].classList.add('active');
  index++;
  if (index >= images.length) {
    index = 0;
  }
  setTimeout(showImage, 3000);
}

showImage();

这段代码会在页面加载后，每隔 3 秒钟切换一次图片。可以通过修改 CSS 样式来改变图片的显示效果。