图片是一盏灯，点击一下灯开了，再点击一下灯灭了，就是灯亮和灯灭可以来回切换，下面这个是正确的代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<img id="light" src="image/off.jpg">
<script>
//获取图片对象
var light =document.getElementById("light");
//代表灯是灭的
var flag = false;
//绑定单击事件
light.onclick = function(){
if(flag){
light.src = "image/off.jpg";
flag = false;
}else{
light.src = "image/on.jpg";
flag = true;
}
}
</script>
</body>
</html>
但是如果我将绑定单击事件中的代码更换为：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<img id="light" src="image/off.jpg">
<script>
//获取图片对象
var light =document.getElementById("light");
//代表灯是灭的
var flag = false;
//绑定单击事件
light.onclick = function(){
if(flag == false){
light.src = "image/on.jpg";
flag = true;
}else{
light.src = "image/off.jpg";
flag = false;
}
}
</script>
</body>
</html>
图片就不能来回切换了，主要是看不懂if语句的逻辑，为什么正确的代码中flag在里面不用写判断语句，而是直接写了个“flag”就可以了
if(flag)如果flag不写判断，是默认为true的。即 flag为true 则执行if语句。为false则执行else语句。
如果你用false判断，写成if(!flag){}；flag前面写英文感叹号，表示非的意思
你确定？
你debug看下变没变，我试了下反正是可以切换的