简单的JS动效——点击灯泡使其点亮或熄灭
我们需要准备的素材有：2张灯泡图片，状态分别是点亮和熄灭，图片宽高必须一致。
首先打开页面是这个已经点亮的状态
当我们点击他时，就会呈现出这个样子。
下面让我们来学习如何实现吧！
首先，写好页面布局。
插入图片：<img src="light_on.gif" onclick="changeimage()" id="myimage">
这里插入的图片是已经点亮的状态，设置一个点击事件为"changeimage" id为"myimage"
然后再下方写下<p>点击灯泡使其点亮或熄灭</p>这个简单的页面布局就弄好了，接下来是js代码。
首先，写一个function changeimage()
然后用document.getElementById获取要选择的ID，上面我们ID写为"myimage"
然后用if判断条件，当match（匹配）到light_on.gif，就表示当前图片匹配，则应该点击时更换图片，所以写上element.src="light_off.gif"来更换为熄灭的图片。
否则，else更换为点亮的图片，然后我们的整个页面就可以实现灯泡的点亮了！
希望各位对各位读者老爷有所帮助，不足之处欢迎提出一起进步。
