一段点击图片改变图片的代码？菜鸟求解！！


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> Change photos</title>
  <script type="text/javascript">
  var myImages=new Array("1.gif","2.gif","3.gif","4.gif");  function changeImage (imgNumber) {
var imgClicked=document.images[imgNumber];
var newImgNumber=Math.round(Math.random()*3);
while (imgClicked.src.indexOf(myImages[newImgNumber])!=-1) {
newImgNumber=Math.round(Math.random()*3);
}
imgClicked.src=myImages[newImgNumber];
return false;
  }
  </script>
 </head> <body> <img name="img1" src="1.gif" boder="0" onclick="changeImage(1)"/> <img name="img2" src="2.gif" boder="0" onclick="changeImage(2)"/>
  
 </body>
</html>
点击第一幅图片时，第二幅图片改变，我的本意是想在点击时自身改变。再点击第二幅图片时出现“无法获取属性src的值，对象可能未定义或为null”的错误，疑惑？？希望高人能够解疑！！对上面的代码能够改进一下达到我想要的效果！谢谢！！