使用js自增进行图片的切换
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta http-equiv="X-UA-Compatible" content="ie=edge" /> <title>Document</title> </head> <body> <img id="img1" src="img/10.jpg" onclick="qh()" widht="200px" height="200px" title="点击切换图片" style="margin: auto;display: block;"> <br><br><br><br> <button onclick="qh()"style="display: block; 100px;height: 50px;margin: auto;background: pink;color: blueviolet;font-size:30px;">点我</button> <script type="text/javascript"> var a = 10; function qh(){ a++; document.getElementById("img1").src="img/"+a+".jpg" ; if(a==13) a=10; } </script> </body> </html>
效果如下点击按钮就可以进行切换下一张