点击切换下一张图片

1.结构

<img src="1.jpg" alt=""><br>
<button>下一张</button>

2.样式

<style>
        body{
            text-align: center;
        }
        img{
            width: 300px;
        }
</style>

3.js部分

<script>
        //鼠标点击下一张 图片切换下一张
        //1.获取元素
        var img = document.getElementsByTagName('img')[0];
        var btn = document.getElementsByTagName('button')[0];
        console.log(img,btn);
         // 3. 当不知道起始值是谁的时候 假设一个变量存初始值
        var n = 1;
        //2.加事件
        btn.onclick = function() {
            n++;
            img.src = ''+ n +'.jpg'
        }
</script>

标签：一张,document,img,getElementsByTagName,点击,切换,var,btn,图片
来源： https://blog.csdn.net/m0_46088512/article/details/120357593