DOM例题----点击按钮切换图片

最新推荐文章于 2023-03-01 10:09:14 发布

Kristen_Zyt

最新推荐文章于 2023-03-01 10:09:14 发布

阅读量438

点赞数

分类专栏： js 文章标签： javascript dom

本文链接：https://blog.csdn.net/fray_zyt/article/details/118708942

版权

js 专栏收录该内容

12 篇文章 0 订阅

订阅专栏

方法一：

/*html部分
<body>
    <button>切换</button>
    <img src='images/1.jpg'>
</body> */    

<script> 
    var btn = document.querySelector('button')
    var img = document.querySelector('img')
    function num(a,b){
        return Math.floor(Math.random()*b-a+1)*a
    }
    btn.onclick = function(){
        img.src = 'images/'+num(1,5)+'.jpg'
    }
</script>

方法二：

//html部分与方法一中的一样
<script>
    var btn = document.querySelector('button')
    var img = document.querySelector('img')
    var arr = ['1.jpg','2.jpg','3.jpg','4.jpg','5.jpg']
    btn.onclick = function(){
        var index = Math.floor(Math.random()*5)
        img.src = 'images/'+arr[index]
}
</script>