开始学习js一段时间了 ，开始练习了不少的代码，下面和大家分享一下事件的处理练习
，
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <title>Document</title> | |
| </head> | |
| <body> | |
| <button onclick="imgChange(1)">第1张图片</button> | |
| <button onclick="imgChange(2)">第2张图片</button> | |
| <button onclick="imgChange(3)">第3张图片</button> | |
| <button onclick="imgChange(4)">第4张图片</button> | |
| <div style="margin-top:20px;"> | |
| <img src="img/1.jpg" alt="" id="imgShow" width="250" height="250"> | |
| </div> | |
| <script> | |
| var imgShow = document.getElementById("imgShow"); | |
| function imgChange(i) | |
| { | |
| imgShow.src = "img/"+i+".jpg"; | |
| } | |
| </script> | |
| </body> | |
| </html> |
这是一个点击按钮实现更换图片功能，这里应用了鼠标点击事件 onclick 以及配套的函数，能够提高用户的体验。