要實現圖片的自動變換，可以使用JavaScript來操作DOM元素和定時器。下面是一個基本的示例代碼：
// 在 HTML 中定義一個包含多個圖片的容器<div id="image-container">
<img src="image1.jpg" alt="Image 1">
<img src="image2.jpg" alt="Image 2">
<img src="image3.jpg" alt="Image 3">
</div>
// JavaScript 代碼
<script>
// 獲取圖片容器和所有圖片元素
var container = document.getElementById("image-container");
var images = container.getElementsByTagName("img");
// 設置初始圖片索引和間隔時間（毫秒）
var currentIndex = 0;
var interval = 2000; // 2秒
// 創建定時器，在指定的間隔時間內切換圖片
setInterval(function() {
// 隱藏當前顯示的圖片
images[currentIndex].style.display = "none";
// 更新索引，確保循環播放
currentIndex = (currentIndex + 1) % images.length;
// 顯示下一張圖片
images[currentIndex].style.display = "block";
}, interval);
</script>
上述代碼通過獲取圖片容器和所有圖片元素，然后利用定時器不斷地隱藏當前顯示的圖片，更新索引，并顯示下一張圖片。
在這個示例中，我們假設圖片容器的id為`image-container`，圖片元素使用`<img>`標簽，并且它們的初始樣式是顯示狀態。
你可以根據你的具體需求進行修改和擴展，比如更改容器id、圖片路徑、間隔時間等，以滿足你的實際應用場景。
