JavaScriptに関する簡単な質問です。

<script>

var image1=new Image();
image1.src = "image/ny.jpg";

var image2=new Image();
image2.src = "image/tokyo.jpg";

var i = 1;

function change(){

if(i==1){
element.src=image2.src;
i=2;
}else{

element.src=image1.src;
i=1;
}

}



</script>

<img id="photo" src="image/ny.jpg" />

<script>

var element = document.getElementByid("photo");

element.onclick=change;

</scropt>

オンクリックで画像が切り替わるというスクリプトなのですが、

new Image() というのは new date() と言うのと関係しているのでしょうか。

var i=1 と言うあたりからよくわからなくなってしまいます。

最後のelement.onclick=change;と言うのもよくわかりません。

スクリプトを平易な日本語で、簡単に説明してもらえるとありがたいです。

よろしくお願いします。

No.2 回答者： LancerVII 回答日時： 2012/09/23 13:45

こんにちは。

http://detail.chiebukuro.yahoo.co.jp/qa/question …
こちらに回答が出ているようですので回答は控えます。

No.1 回答者： LancerVII 回答日時： 2012/09/22 07:02

こんにちは。

>new Image() というのは new date() と言うのと関係しているのでしょうか
Imageオブジェクトを使いますという宣言です。
new Date()はDateオブジェクトを使いますという宣言です。
使うものは違いますが、やっていることは一緒です。

// image1はImageオブジェクト
var image1=new Image();
// Imageオブジェクトのsrcに画像を設定
image1.src = "image/ny.jpg";

// image1と同じ
var image2=new Image();
image2.src = "image/tokyo.jpg";

// iをグローバル変数として宣言し1を代入
var i = 1;

// changeという関数を設定
function change(){

// iを判別
if(i==1){
// iが1の場合はelement(すなわちid="photo"の画像)に
// image2.srcを設定(image2.srcはimage/tokyo.jpgなのでtokyo.jpgに切り替わる
element.src=image2.src;
// iを2にする
i=2;
}else{
// iが1以外の場合(この場合2になっている)
// image1.srcを設定(image1.srcはimage/ny.jpgなのでny.jpgに切り替わる
element.src=image1.src;
// iを1にする
i=1;
}

}

最初にクリックしたときはi=1なのでtokyo.jpgに切り替えてi=2にします。
次にクリックするとi=2なのでny.jpgに切り替えてi=1にします。
(これが繰り返されます)

element.onclick=change;
これは<img id="photo">をelementに取得していますので
<img id="photo">のクリックイベントにchange関数をセットしています。

こうすうることで上記で説明した動きをクリックするたびに実行します。(change関数が呼ばれる)

この回答への補足

大変ありがとうございます。
＞// image1はImageオブジェクト
＞var image1=new Image();

なぜここでオブジェクトを使うのですか。（済みません超基本がわかっていません）
var image="image/ny.jpg"; とかではだめなんでしょうか。

＞element.onclick=change;
＞これは<img id="photo">をelementに取得していますので
＞<img id="photo">のクリックイベントにchange関数をセットしています。

ここの部分はわかった気がします。ありがとうございます。

＞var i = 1

のあたりも、少し考えたらわかりました。指呼し前に出た本からの引用なので、書き方が古いか、
初心者用に書いてあるかもしれません。違う書き方とかあったら教えてください。（求めすぎで済みません）

補足日時：2012/09/22 11:41