07-刷新图片随机更换

最新推荐文章于 2024-08-11 18:40:36 发布

Strohhut

最新推荐文章于 2024-08-11 18:40:36 发布

阅读量36

点赞数

分类专栏：黑马程序员APIs（1）文章标签： javascript html java

本文链接：https://blog.csdn.net/Strohht/article/details/130674770

版权

黑马程序员APIs（1）专栏收录该内容

17 篇文章 1 订阅

订阅专栏

该代码示例展示了一个HTML页面，其中包含一个JavaScript函数用于生成介于1到6之间的随机数，然后使用这个随机数来改变图片的源地址，实现图片的随机显示。图片格式为WebP。

摘要由CSDN通过智能技术生成

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <img src="./images/1.webp" alt="">
    <script>
        //取 N ~ M 的随机函数  直接套公式
        function getRandom(N, M) {
            return Math.floor(Math.random() * (M - N + 1)) + N
        }
        // 1.获取图片
        const img =document.querySelector('img')
        // 2.随机得到图片
        const random = getRandom(1,6)
        // 3.更换元素
        img.src = `./images/${random}.webp`
    </script>
</body>

</html>