javascript

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>灯泡开关</title>
</head>
<body>
<img  id ='off' src="img/off.gif" >
<script>
    var l1=document.getElementById("off")
    function fun(){
        var flag=false;
        if(flag){
            l1.src="img/off.gif";

            alert(flag);
        }
        else {
                l1.src="img/on.gif";
                flag=true;
               // alert(flag)
            }
    }
    l1.onclick=fun;
</script>
</body>
</html>

判断语句能执行到flag=true但是就是不能跳到第一个if语句是怎么回事呢

我觉得你的那个var flag=false;应该定义再fun函数外部

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <title>Document</title>
 </head>
 <body>
<!--   <img  id ='off' src="img/off.gif" > -->
   <div  id ="off" style="background-color:black;padding: 10px;width: 50px;margin: 0 auto;"></div>

<script>
    var op = false;
    var l1=document.getElementById("off");
    l1.onclick=fun;
      function fun(){
     
        if(op){
            //l1.src="img/off.gif";
			l1.style.backgroundColor="black";
			op= false;
        }
        else {
                //l1.src="img/on.gif";
				l1.style.backgroundColor="green";
				op= true;
            }
    }
</script>
 </body>
</html>

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>灯泡开关</title>
</head>
<body>
<img  id ='off' src="img/off.gif" >
<script>
    var l1=document.getElementById("off")
    var flag=false;
    function fun(){
        
        if(flag){
            l1.src="img/off.gif";
            alert(flag);
        }
        else {
                l1.src="img/on.gif";
                flag=true;
               // alert(flag)
            }
    }
    l1.onclick=fun;
</script>
</body>
</html>

 

var flag=false;你定义在了函数内部,那么每次你调用这个函数时,都会先给flag赋值为false,你的if判定永远都会走else,执行else后虽然flag会被赋值为true,但是当你再次点击时又会先执行var flag=false,那么就又会走else,所以应该将var flag=false;定义在函数外部,而不是内部。