HTML5提供了许多实用的特性，其中自动轮显图片的功能很受欢迎。

<p ><img src="img1.jpg" alt="Image 1"><img src="img2.jpg" alt="Image 2"><img src="img3.jpg" alt="Image 3"></p><script>var index = 0;var slides = document.getElementById("slideshow").getElementsByTagName("img");function changeSlide() {for (var i = 0; i < slides.length; i++) {slides[i].style.display = "none";}index++;if (index >= slides.length) {index = 0;}slides[index].style.display = "block";}setInterval(changeSlide, 5000);</script>

JS代码跟HTML代码部分相互作用。首先，我们定义了一个全局变量index，用于标记当前显示的图片。接着，我们通过ID获取到p元素，并使用getElementsByTagName方法获取到所有的img元素。在changeSlide方法中，我们遍历所有的img元素，将它们的样式display设为none，使其隐藏。同时，index自增1，如果index大于或等于img元素的数量，则将index置为0，从头开始轮显图片。最后，将当前index对应的img元素的样式display设为block，使其显示。

最后，我们使用setInterval方法实现轮显效果。该方法接收两个参数，第一个参数是具体要执行的操作（本例中为changeSlide方法），第二个参数是时间间隔，单位为毫秒。这里我们将间隔设为5000ms，即每5秒切换一次图片。