<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>电灯开关</title> </head> <body> <img id="light" src="img/off.gif" alt=""> <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>