用一个开关实现两张图片之间的切换 
 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4     <meta charset="utf-8">
 5     <title>两张图片之间相互切换的判断实例</title>
 6 </head>
 7 <body>
 8 <img src="../images/1.jpg" alt="#" id="img1">
 9 <script type="text/javascript">
10     //让两张图片之间相互切换，就是在点击第一张图片的时候，把第二张图片的路径
11     //交给当前的img标签,但是img标签的src不能做判断,所以我们做一个开关来改变img的src
12     var oImg = document.getElementById("img1");
13     var onOff = true;   //首先将这个开关设置为true；当点击第一张图片的时候，程序会执行if里面的语句
14     //把第二张图片的路径赋给oImg.src，然后再将开关设置成false，当第二次点击图片的时候，
15     //程序会执行else里面的语句，把第一张图片的路径赋给oImg.src，然后再将开关设置成true，
16     //这样每一次点击的时候，开关的值在true与false之间切换。
17     oImg.onclick = function(){
18         if(onOff){
19             oImg.src = '../images/2.jpg';
20             onOff = false;
21         }else{
22             oImg.src = '../images/1.jpg';
23             onOff = true;
24         };
25     };
26 
27 </script>
28 </body>
29 </html>

 

posted on 2016-05-28 11:21  冬刻忆  阅读(372)  评论(0)    收藏  举报