- <!doctype html>
- <html>
- <head>
- <meta charset="utf-8">
- <title>JS基础——两张图来回切换</title>
- <script>
- window.onload = function(){
- var oImg = document.getElementById('img');
- var onOff = true;
- oImg.onclick = function(){
- if(onOff){
- oImg.src = 'http://placehold.it/200x200';
- onOff = false;
- }else{
- oImg.src = 'http://placehold.it/150x150';
- onOff = true;
- }
- };
- };
- </script>
- </head>
- <body>
- <img id="img" src="http://placehold.it/150x150">
- </body>
- </html>
两张图片来回切换思路:
通过if else语句和自定义开关属性来判断图片切换