HTML 代碼輪播是一個(gè)非常實(shí)用的功能，通過在網(wǎng)頁上嵌入輪播圖，可以非常方便地展示多張圖片或者內(nèi)容。下面，我們來看一下如何通過 HTML 代碼實(shí)現(xiàn)簡(jiǎn)單的輪播效果：

<div id="slider">
<img class="slide" src="img1.jpg">
<img class="slide" src="img2.jpg">
<img class="slide" src="img3.jpg">
<img class="slide" src="img4.jpg">
<img class="slide" src="img5.jpg">
</div>
<script>
var slider = document.getElementById("slider");
var slides = slider.querySelectorAll(".slide");
var currentSlide = 0;
function nextSlide() {
slides[currentSlide].classList.remove("active");
currentSlide = (currentSlide + 1) % slides.length;
slides[currentSlide].classList.add("active");
}
setInterval(nextSlide, 5000);
</script>

以上代碼中，我們首先在 HTML 中創(chuàng)建了一個(gè) id 為 "slider" 的 div 標(biāo)簽，并在其中插入了五張圖片。接下來，我們通過 JavaScript 選中了這個(gè) div 標(biāo)簽，并獲取了它中所有 class 為 "slide" 的圖片元素。

然后，我們定義了一個(gè)當(dāng)前圖片的下標(biāo)變量 currentSlide，初始值為 0，表示第一張圖片開始顯示。接著，我們定義了一個(gè) nextSlide() 函數(shù)，用于切換圖片。該函數(shù)會(huì)將當(dāng)前圖片的 class "active" 屬性移除，然后將 currentSlide 變量加一，實(shí)現(xiàn)圖片循環(huán)播放的效果。

最后，我們使用 setInterval 函數(shù)，每間隔 5000 毫秒執(zhí)行一下 nextSlide() 函數(shù)，從而實(shí)現(xiàn)圖片輪播。通過這樣簡(jiǎn)單的代碼，就可以在你的網(wǎng)頁上展示出充滿活力和美感的輪播圖。