<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>电灯开关</title>
</head>
<body>
<img id="light" src="img/off.gif" >
<script>
/*
* 分析
* 1.获取对象
* 2.绑定事件
* 3.设置事件：每次点击切换图片
* 规则：开——关，关——开
* 使用flag来完成
* */
//1.获取对象
var light = document.getElementById("light");
var flag = false;//代表灯是灭的
//2.绑定事件
light.onclick = function () {
if (flag) {
//灯是开的就灭掉
light.src = "img/off.gif";
flag=false;
} else {
//灯是关的就打开
light.src = "img/on.gif";
flag=true;
}
}
</script>
</body>
</html>
原文：https://www.cnblogs.com/rijiyuelei/p/12377871.html