画像を変更する

画像の上でマウスをクリックすると画像が変わる

<html>
<head>
<META http-equiv="Content-Type" content="text/html; charset=x-sjis">
<title>オブジェクトの変更</title>
<script language="javascript">
var ch=0 ; // オブジェクトの番号 (番号.jpg　が表示される)
function disp()
{
  ch=(ch+1)% 9 ;
  stnm= ch + ".jpg" ; //　マウスクリックで画像ファイル名を変更　：　stnmに（番号.jpg）を代入

  document.images["s"].src = stnm ; // name="s"の　img タグのファイルをstnmにする
}
</script>
</head>
<body bgcolor=000000 text=ffffff topmargin=0 leftmargin=0>
<img src="0.jpg" name="s" onclick="disp()">
</body>
</html>

<html>
<head>
<META http-equiv="Content-Type" content="text/html; charset=x-sjis">
<title>オブジェクトの変更</title>
<script language="javascript">

変数　ch　を定義して初期値（デフォルト画像）を　"0.jpg"　にする

var ch=0 ; // オブジェクトの番号 (番号.jpg　が表示される)

マウスクリックで実行される関数

function disp()
{

ch を変更して画像ファイル(stnm)をにする

  ch=(ch+1)% 9 ;
  stnm= ch + ".jpg" ; //　マウスクリックで画像ファイル名を変更　：　stnmに（番号.jpg）を代入

imgタグにname="s"と指定した画像をstnmにする

  document.images["s"].src = stnm ; // name="s"の　img タグのファイルをstnmにする

}
</script>
</head>
<body bgcolor=000000 text=ffffff topmargin=0 leftmargin=0>

imgタグで

デフォルト画像をsrc="0.jpg"で指定
このタグにname="s"でsという名前を付ける
マウスクリックでdisp()を実行　：　onclick="disp()"

<img src="0.jpg" name="s" onclick="disp()">

</body>
</html>