我有一些jpg文件分别为1jpg2jpg427jpg我想实现一个html网页该网页有一个按钮点击随机出现一张上述jpg照片中的一张
下面是一个简单的实现方式:
- 在html文件中添加一个按钮和一个图片元素:
<button onclick="showRandomImage()">随机图片</button>
<img id="randomImage" src="" alt="">
- 在JavaScript中定义一个函数,用于随机选择一张图片并将其显示在图片元素中:
function showRandomImage() {
var num = Math.floor(Math.random() * 427) + 1; // 随机生成一个1~427的整数
var imgUrl = num + ".jpg"; // 构建图片文件名
document.getElementById("randomImage").src = imgUrl; // 将图片显示在图片元素中
}
- 将html文件和所有的.jpg文件放在同一个文件夹中,并在浏览器中打开该html文件,即可看到随机图片按钮和对应的图片元素。每次点击按钮,都会随机选择一张图片并将其显示在图片元素中
原文地址: https://www.cveoy.top/t/topic/cyWK 著作权归作者所有。请勿转载和采集!