描述:鼠标点击下一张,图片切换到下一张
图片可替换
<style>
body{
text-align: center;
}
</style>
<img src="./img/1.jpg" alt="">
<br>
<button>下一张</button>
<script>
// 1、获取元素
var img = document.getElementsByTagName('img')[0];
var btn = document.getElementsByTagName('button')[0];
console.log(img,btn);
// 2、加事件
// 4、不知道起始位置 假设一个变量存初始值
var n = 1;
btn.onclick = function (){
// 3、切换到下一张
n++;
console.log(n);
// 5、换图片
img.src = './img/' + n + '.jpg'
}
</script>
效果: