<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<button id="btn">帅哥</button>
<img src="../img/1.jpg"/ >
</body>
<script type="text/javascript">
var btn = document.getElementById('btn')
var img = document.querySelector('img');
console.log(img)
var i = 1;
//声明一个变量用于图片点击后变化的图片
var arr = [1,2,3]
//把图片的名称存储为数组。
btn.onclick = function(){
if(i<arr.length){
i++
img.src = "../img/"+i+".jpg";
}else{
i = arr[0]
//否则就让i=数组下标0对应的元素
img.src = "../img/"+i+".jpg";
}
}
</script>
</html>