<!DOCTYPE html>
<html>
<body>
<script>
function changeImage()
{
element=document.getElementById('myimage')
if (element.src.match("bulbon"))
{
element.src="/i/eg_bulboff.gif";
}
else
{
element.src="/i/eg_bulbon.gif";
}
}
</script>
<img id="myimage" onclick="changeImage()" src="/i/eg_bulboff.gif">
<p>点击灯泡来点亮或熄灭这盏灯</p>
</body>
</html>
代码解析：
element.src.match("bulbon")意思是：Src路径里有bulbon匹配则为true.如果一开始的图片是/i/eg_bulbon.gif，那么就会匹配到bulbon，if语句为ture，执行if语句，图片转换为/i/eg_bulboff.gif；如果没匹配到bulbon，执行else语句，图片转换为/i/eg_bulbon.gif。这样就实现了用js对html图片的改变
我的：
<script>
function sexImage()
{
element=document.getElementById('myimage')
if(element.src.match("boy"))
{element.src="./girl.jpg"}
else{
element.src="./boy.jpg";
}
}
</script>
<img id="myimage"onclick="sexImage()"
src="./boy.jpg"width="100"height="100">
</body>