JQuery

JQueryっていうのがあって、それを使うとJavascriptのスクリプト作成が楽になるらしいとのことで、
今日の午後、お試しでホームページをいじっていました。

【以前のHTML】
<a onClick="myABC()"><img src="abc.gif"></a>

※aタグで囲まれた画像をクリックしたら、myABC関数を呼び出す

【以前のJavascript】
function myABC(){
if(document.getElementById("IdCDTd00").style.display == "none"){
document.getElementById("IdCDTd00").style.display = "";
}else{
document.getElementById("IdCDTd00").style.display = "none";
}
}

※style.displayの値をnone ←→ ""と切り替えて、id="IdCDTd00"の要素を表示したり、非表示にする。

【変更後のHTML】
<a id="IdABC"><img src="abc.gif"></a>

※aタグから、onClickを削除して、idを追加

【変更後のJavascript/JQuery】
$(function(){
$("#IdABC").click(function(){
var myDisp1 = $("#IdCDTd00").css("display");
if(myDisp1 == "none"){
$("#IdCDTd00").css("display","");
}else{
$("#IdCDTd00").css("display","none");
}
});
});

※id="IdABC"の要素がクリックされたら呼び出されるメソッドを追加

JQueryについては、ネット上にいっぱいありますので、詳しいことは、そちらを参照願います

Jesus Doesn't Want Me For A Sunbeam - Nirvana (Unplugged)


※YouTubeの動画を貼り付けていますが、著作権、肖像権、その他の理由により、動画が削除されるときがあります。そんな場合に備えて、動画のタイトルをコピペするようにしました。



これは、どこでしょう？

タグ：jQuery JavaScript

コメント 5

コメントありがとうございました。(^o^)／
また寄って下さいね。
by RodorigesEX (2012-05-06 16:51) 

RodorigesEXさん、
どういたしまして。また寄らしていただきます。
(^_0)ノ
by cheese999 (2012-05-06 20:57) 

nice! ありがとうございます。

つくば で竜巻があったとか。。
これも、人間の悪行のなせる業でしょうか？
(^_0)ノ
by cheese999 (2012-05-06 22:14) 

ご訪問下さいましてありがとうございました。(^o^)
by tooshiba (2012-05-07 10:30) 

tooshibaさん、
どういたしまして。
(^_0)ノ
by cheese999 (2012-05-07 22:40)