JavaScriptサンプル。
■タイマー
timerStr = setTimeout("関数名", イベント発生ミリ秒)
clearTimeout(タイマーID);
function strScroll(){
timerStr = setTimeout("strScroll()", 200);
if(i == 100){
clearTimeout(timerStr);
}
i++;
}
■文字列
・文字列の連結
i = 1 + 2;
iは、「3」になる
i = "1" + "2";
iは、「12」になる。
i = "あ" + "か";
iは、「あか」になる。
・文字列の分割
str.substring(開始文字位置, 終了文字位置)
どちらも先頭からのバイト数
str = "テスト";
str.substring(0, 2);
・文字列の長さ・バイト数
str = "テスト";
i = str.length;
・文字一致、検索
indexOf("検索対象文字列", 検索開始位置)
一致した場合は、一致した位置（先頭からのバイト数 0以上）
一致しない場合は、-1。
lastIndexOf("検索対象文字列", 検索開始位置)
一致した場合は、一致した位置（後方からのバイト数 0以上）
一致しない場合は、-1。
str = "Mozilla/5.0 (Windows; U; Windows NT 5.2; ja-JP; rv:1.7.7) Gecko/20050414 Firefox/1.0.3"
i = str.indexOf("FireFox", 0);
・置換
replace("置換前の文字", "置換後の文字")
str = "ABC TEST SAMPLE";
str = str.replace("TEST", "テスト");
■配列
strArray = new Array("A", "B", "C", "D", "E");
strA = strArray[0];
■日付・時刻
・現在の日時
nd = new Date();
dy = nd.getYear();
dm = nd.getMonth() + 1;
dd = nd.getDate();
hh = nd.getHours();
hm = nd.getMinutes();
hs = nd.getSeconds();
・ページ、ファイルの最終更新日
lm = document.lastModified;
■右クリック禁止
・onContextmenu="return false"で右クリックした時に、
コンテキストメニューが表示されないようになります。
・ページのソースを見せないようにする場合などに使用。
・ブラウザのメニューバー（URL）を表示させないようにしたり、
他にも対策が必要です。
（メニューバーなしのウィンドウを開いて、そこに画像を表示したなど）
ただし、完全に保護できる分けではありません。
<HTML>
<HEAD></HEAD>
<BODY onContextmenu="return false">
<IMG SRC="jscript/others/0039.jpg" onMousedown="javaScript:alert('保存禁止です');">
</BODY>
</HTML>
■ダイアログ
・警告ダイアログ、アラート
<A HREF="JavaScript:void(0);" onClick="alert('警告ダイアログ');">リンク</A>
・確認ダイアログ
<A HREF="JavaScript:void(0);" onClick="dispWin();">リンク</A>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
function dispWin(){
choice = confirm("確認ダイアログ");
if(choice == true){
alert("OK選択");
}else{
alert("キャンセルを選択");
}
}
//-->
</SCRIPT>
・入力ダイアログ / prompt("メッセージ", "入力欄の文字")
<A HREF="JavaScript:void(0);" onClick="dispWin();">リンク</A>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
function win(){
choice = prompt("文字を入力して下さい。", "");
if(choice == "cylas"){
alert("正解");
}else{
alert("不正解");
}
}
//-->
</SCRIPT>
・印刷ダイアログ
<FORM NAME="form">
<INPUT TYPE="button" VALUE="印刷" onClick="print();">
</FORM>
■ページの背景色変更
<FORM NAME="form">
<INPUT TYPE="button" VALUE=" 赤 " onClick="document.bgColor='#FF0000'">
<INPUT TYPE="button" VALUE=" 緑 " onClick="document.bgColor='#00FF00'">
<INPUT TYPE="button" VALUE=" 青 " onClick="document.bgColor='#0000FF'">
<INPUT TYPE="button" VALUE=" 白 " onClick="document.bgColor='#FFFFFF'">
</FORM>
■ページジャンプ、location
document.location = "http://example.com/";
・例
<FORM NAME="form">
<SELECT NAME="box" onChange="document.location=options[this.selectedIndex].value">
<OPTION VALUE="void(0);" selected>サイトを選択
<OPTION VALUE="./html/index.html">HTMLのページ
<OPTION VALUE="http://example.com/">http://example.com/
</SELECT>
</FORM>
==================== ブラウザ（Browser）関連 ====================
■ブラウザ情報
・エージェント / Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1;)など
agent = navigator.userAgent;
・アプリケーション名 / Microsoft Internet Explorerなど
name = navigator.appName;
・バージョン / 4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1;)
ver = navigator.appVersion;
・言語 / jaなど、IEの場合undefined
lang = navigator.language;
・コードネーム / Mozillaなど
code = navigator.appCodeName;
■参照元URL、リファラ、Referer
referrer = " + escape(document.referrer);
■戻る
・ブラウザの履歴にある前のページに戻る
<A HREF="javaScript:history.back();">戻る</A>
■進む
・ブラウザの履歴にある先のページに進む
<A HREF="javaScript:history.forward();">進む</A>
■お気に入りに追加、ブックマークに追加、Favorite
・フォームボタンの例
<FORM>
<INPUT TYPE="button" VALUE="お気に入りに追加" onClick="window.external.addFavorite('http://example.com/','OshimaExe');">
</FORM>
・リンクの例
<A HREF="javaScript:window.external.addFavorite('http://example.com/','OshimaExe');">お気に入りに追加</A>
■ステータスバーに表示
status = "サンプル";
==================== ウィンドウ（Window）関連 ====================
■ウィンドウを開く、新規作成、新規ウィンドウをオープン
<A HREF="JavaScript:void(0);" onClick="dispWin();">リンク</A>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
msg = "ウィンドウオープン。<BR>HTMLファイルは不要。"
function dispWin(){
helpwin = window.open("", "", "status=yes, WIDTH=300, HEIGHT=100");
helpwin.document.open();
helpwin.document.write("<HTML><BODY>");
helpwin.document.write(msg);
helpwin.document.write("</BODY></HTML>");
opwin.document.close();
}
//-->
</SCRIPT>
■ウィンドウを閉じる
<A HREF="javaScript:close();">閉じる</A>
■ウィンドウをスクロール
scroll(X座標, Y座標);
scroll(100, 100);
document.sample.scroll(100, 100);
■ウィンドウ・マウスの座標位置
・マウスの現在座標表示例
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
function xyCheck(myEvent){
status = "座標：" + window.event.clientY;
}
document.onmousedown = xyCheck;
//-->
</SCRIPT>
・IE系の場合
X座標 window.event.clientX
Y座標 window.event.clientY
スクロールした状態でのX座標 document.body.scrollLeft
スクロールした状態でのY座標 document.body.scrollTop
・Netscape6系の場合
X座標 myEvent.clientX
Y座標 myEvent.clientY
スクロールした状態でのX座標 window.pageXOffset
スクロールした状態でのY座標 window.pageYOffset
・Netscape4系の場合
X座標 myEvent.x
Y座標 myEvent.y
■キーボードの押されたキー番号の取得（キーコード）
・マウスの現在座標表示例
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
function keyCheck(myEvent){
status = "keyCode：" + event.keyCode;
}
document.onkeydown = keyCheck;
//-->
</SCRIPT>
・IE系の場合
event.keyCode
・Netscape系の場合
myEvent.which
■ディスプレイ情報
・ディスプレイ横幅
screenWidth = screen.width;
・ディスプレイ縦幅
screenHeight = screen.height;
・ディスプレイ色数
colorDepth = screen.colorDepth;
==================== フォーム（Form）関連 ====================
■フォームのテキストボックスにカーソルを移動
<HTML>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
function Box_Select(){
document.imgwh.imgurl.select();
}
//-->
</SCRIPT>
</HEAD>
<BODY onLoad="Box_Select();">
<FORM NAME="imgwh">
<INPUT TYPE="text" NAME="imgurl">
</FORM>
■フォームの値を受け取る
document.midform.bgmmid.value
・例
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
function hyouji(){
if(document.midform.bgmmid.value == "no") exit;
var opwin = window.open("", "", "WIDTH=300, HEIGHT=30");
opwin.document.open();
opwin.document.write("<EMBED SRC=" + document.midform.bgmmid.value + " LOOP=true AUTOSTART=true>");
opwin.document.close();
}
//-->
</SCRIPT>
<FORM NAME="midform">
<SELECT NAME="bgmmid" onChange="hyouji();">
<OPTION VALUE="no" selected>音楽選択
<OPTION VALUE="beyer090.mid">beyer090.mid
<OPTION VALUE="beyer091.mid">beyer091.mid
<OPTION VALUE="beyer092.mid">beyer092.mid
<OPTION VALUE="beyer093.mid">beyer094.mid
<OPTION VALUE="beyer094.mid">beyer094.mid
</SELECT>
</FORM>
■ボタン、テキストボックスなどの無効化
・ボタンを押せなくする
・テキストボックスに入力できないようにする
・テキストボックスなど入力欄を無効化して送信すると、値が送信されない。
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
function disabledFalse(){
document.form1.text1.disabled = false;
document.form1.button1.disabled = false;
document.form1.submit1.disabled = false;
}
function disabledTrue(){
document.form1.text1.disabled = true;
document.form1.button1.disabled = true;
document.form1.submit1.disabled = true;
}
function formSubmit(){
document.form1.submit();
document.form1.button1.disabled = true;
document.form1.submit1.disabled = true;
}
//-->
</SCRIPT>
<FORM NAME="form1" METHOD="POST" ACTION="./test.php" onSubmit="formSubmit();">
<INPUT TYPE="text" NAME="text1" VALUE="テキスト" disabled>
<INPUT TYPE="button" NAME="button1" VALUE="ボタン" onClick="formSubmit();" disabled>
<BR>
<INPUT TYPE="button" VALUE="無効" onClick="disabledTrue();">
<INPUT TYPE="button" VALUE="有効" onClick="disabledFalse();">
<BR>
<INPUT TYPE="radio" NAME="radio1" VALUE="0" onClick="disabledTrue();" CHECKED>了承しない
<INPUT TYPE="radio" NAME="radio1" VALUE="1" onClick="disabledFalse();">了承する
<BR>
<INPUT TYPE="submit" NAME="submit1" VALUE="送信" disabled>
</FORM>
■画像の縦横サイズを取得
・テキストボックスに画像のファイル名またはパスを入力して、
「表示」ボタンを選択すると画像が表示される。
・ステータスバーに画像の縦横サイズを表示。
・画像上にマウスをあわせると画像上のマウスの現在位置を取得
<HTML>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
function Disp_Page(){
document.images[0].src = document.imgwh.imgurl.value;
}
function Img_Width_Height(){
status = "WIDTH = " + document.images[0].width + " , " + "HEIGHT = " + document.images[0].height;
}
function Img_X_Y_Disp(){
status = "X座標 = " + (event.x) + " , " + "Y座標 = " + (event.y-10);
}
function Img_X_Y_Reset(){
Img_Width_Height();
}
//-->
</SCRIPT>
<BODY>
<FORM NAME="imgwh">
<INPUT TYPE="text" NAME="imgurl">
<INPUT TYPE="button" NAME="disp" VALUE="表示" onClick="Disp_Page();">
</FORM>
<IMG SRC="" STYLE="position:relative; top:10; left:0;"
onLoad="Img_Width_Height();"
onClick="Img_X_Y_Disp();"
onMouseOut="Img_X_Y_Reset()">
</BODY>
</HTML>
==================== クッキー（Cookie）関連 ====================
■クッキー基本設定
・サンプルの操作手順
1. テキストボックスに文字を入力
2. [Cookie設定/変更]を選択
3. [リセット]を選択して、文字を消去
4. [Cookie読み込み]を選択
5. 最初にテキストボックスに入力した内容が復活
6. [Cookie削除]を選択
7. [Cookie読み込み]を選択しても、何も表示されない
・例1（基本設定）
<HTML>
<BODY>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
function setCookie(){
document.cookie = escape(document.sample1.name1.value);
}
function getCookie(){
document.sample1.name1.value = unescape(document.cookie);
}
function deleteCookie(){
document.cookie = "";
document.sample1.name1.value = "";
}
//-->
</SCRIPT>
<FORM NAME="sample1">
<INPUT TYPE="text" NAME="name1"><BR>
<INPUT TYPE="button" VALUE="Cookie設定/変更" onClick="setCookie();"><BR>
<INPUT TYPE="button" VALUE="Cookie読み込み" onClick="getCookie();"><BR>
<INPUT TYPE="button" VALUE="Cookie削除" onClick="deleteCookie();"><BR>
<INPUT TYPE="reset"><BR>
</FORM>
</BODY>
</HTML>
・例2（時間設定：クッキーが消える時間を指定）
<HTML>
<BODY>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
function setCookie(){
nd1 = new Date();
//現在の時間から7日後の時間をセット
nd1.setTime(nd1.getTime() + (24 * 60 * 60 * 1000 * 7));
//GMT形式に変換
expires = nd1.toGMTString();
str1 = document.sample2.name1.value;
//テキストボックスの内容を「a1」という名前をつけてCookieに保存
//「a1=テキストボックスの内容;expires=有効期限」という形式でCookieをセット
//「a1=」は「str1=」など好きな名称でいいが、「expires=」という書き方は決まり
if(str1 != null && str1 != ""){
document.cookie = "a1=" + escape(str1)
+ ";expires=" + expires;
}
}
function getCookie(){
//Cookie内の「=」で区切られたデータを「=」を境に分割し、配列splitdataする
//splitdata[0]が「a1」、splitdata[1]が「テキストボックスに入力した内容」
splitdata = document.cookie.split("=");
if(splitdata[1] != null && splitdata[1] != ""){
//splitdata[1]の内容をテキストボックスにセット
//escapeした内容を元に戻すためにunescape
document.sample2.name1.value = unescape(splitdata[1]);
}
if(splitdata[1] == null || splitdata[1] == ""){
document.sample2.name1.value = "";
}
}
function deleteCookie(){
nd2 = new Date();
//現在より過去の時間をセット
nd2.setTime(nd2.getTime() - 1);
//cookieの項目「a1」の有効期限を過去の時間に設定することにより「a1」のCookie情報が消える
document.cookie = "a1=;expires=" + nd2.toGMTString();
document.sample2.name1.value = "";
}
//-->
</SCRIPT>
<FORM NAME="sample2">
<INPUT TYPE="text" NAME="name1"><BR>
<INPUT TYPE="button" VALUE="Cookie設定/変更" onClick="setCookie();"><BR>
<INPUT TYPE="button" VALUE="Cookie読み込み" onClick="getCookie();"><BR>
<INPUT TYPE="button" VALUE="Cookie削除" onClick="deleteCookie();"><BR>
<INPUT TYPE="reset"><BR>
</FORM>
</BODY>
</HTML>
・例3（複数項目設定：複数の情報をクッキーに保存）
<HTML>
<BODY>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
function setCookie(){
nd1 = new Date();
//現在の時間から7日後の時間をセット
nd1.setTime(nd1.getTime() + (24 * 60 * 60 * 1000 * 7));
//GMT形式に変換
expires = nd1.toGMTString();
str1 = document.sample3.name1.value;
str2 = document.sample3.name2.value;
//テキストボックス1の内容を「a1」、テキストボックス2の内容を「a2」という名前をつけてCookieに保存
//まず「a1=テキストボックス1の内容;expires=有効期限」という形式でCookieをセット
//「a1=」は「str1=」など好きな名称でいいが、「expires=」という書き方は決まり
//続けて「a2=テキストボックス2の内容;expires=有効期限」という形式でCookieをセット
if(str1 != null && str1 != ""){
document.cookie = "a1=" + escape(str1)
+ ";expires=" + expires
}
if(str2 != null && str2 != ""){
document.cookie = "a2=" + escape(str2)
+ ";expires=" + expires;
}
}
function getCookie(){
//Cookie内の「; 」で区切られたデータを「; 」ごとに分割し、配列splitdataにする
//splitdata[0]は「a1=テキストボックス1に入力した内容」
//splitdata[1]は「a2=テキストボックス2に入力した内容」
splitdata = document.cookie.split("; ");
if(splitdata[0] != null && splitdata[0] != ""){
//splitdata[0]の「=」で区切られたデータを「=」を境に分割し、配列s0にする
//s0[0]が「a1」、s0[1]が「テキストボックス1に入力した内容」
s0 = splitdata[0].split("=");
//s0[1]の内容をテキストボックスにセット
//escapeした内容を元に戻すためにunescape
//s1[1]も同様
document.sample3.name1.value = unescape(s0[1]);
}
if(splitdata[1] != null && splitdata[1] != ""){
s1 = splitdata[1].split("=");
document.sample3.name2.value = unescape(s1[1]);
}
//何もセットされていないときは、空欄を表示
if(splitdata[0] == null || splitdata[0] == ""){
document.sample3.name1.value = "";
}
if(splitdata[1] == null || splitdata[1] == ""){
document.sample3.name2.value = "";
}
}
function deleteCookie(){
nd2 = new Date();
//現在より過去の時間をセット
nd2.setTime(nd2.getTime() - 1);
//cookieの項目「a1」の有効期限を過去の時間に設定することにより「a1」のCookie情報が消える
//「a2」も同様
document.cookie = "a1=;expires=" + nd2.toGMTString();
document.cookie = "a2=;expires=" + nd2.toGMTString();
document.sample3.name1.value = "";
document.sample3.name2.value = "";
}
//-->
</SCRIPT>
<FORM NAME="sample3">
<INPUT TYPE="text" NAME="name1"><BR>
<INPUT TYPE="text" NAME="name2"><BR>
<INPUT TYPE="button" VALUE="Cookie設定/変更" onClick="setCookie();"><BR>
<INPUT TYPE="button" VALUE="Cookie読み込み" onClick="getCookie();"><BR>
<INPUT TYPE="button" VALUE="Cookie削除" onClick="deleteCookie();"><BR>
<INPUT TYPE="reset"><BR>
</FORM>
</BODY>
</HTML>
==================== フレーム（frame）関連 ====================
■別フレームのページ変更
・左フレームのメニュー選択で、右フレームのページが変化。
・top.フレーム名.document.location で変更する。
・フレーム土台
<HTML>
<FRAMESET COLS="20%,*" FRAMEBORDER=1>
<FRAME SRC="menu.htm" name="leftWin">
<FRAME SRC="top.htm" name="rightWin">
</FRAMESET>
</HTML>
・左フレーム
<HTML>
<HEAD>
<FORM NAME="form">
<SELECT NAME="box" onChange="top.rightWin.document.location=options[this.selectedIndex].value">
<OPTION VALUE="top.html" selected>メニューを選択
<OPTION VALUE="new.html">What's New
<OPTION VALUE="profile.html">プロフィール
</SELECT>
</FORM>
</BODY>
</HTML>
■IFRAMEのページ変更
<HTML>
<BODY>
<IFRAME SRC="1.htm" ID="MADO">1.htm</IFRAME>
<BR>
<FORM NAME="form">
<SELECT NAME="box" onChange="MADO.location=options[this.selectedIndex].value">
<OPTION VALUE="1.html" selected>1ページ
<OPTION VALUE="2.html">2ページ
</SELECT>
</FORM>
</BODY>
</HTML>
■別フレームのフォーム内容変化
・左フレームのリンク選択で、右フレームのテキストエリアの文字が変化。
・フレーム土台
<HTML>
<FRAMESET COLS="20%,*" FRAMEBORDER=1>
<FRAME SRC="menu.htm" name="leftWin">
<FRAME SRC="top.htm" name="rightWin">
</FRAMESET>
</HTML>
・左フレーム
<HTML>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
flag = 0;
function test(n){
if(n == 0) msg = "トップページ";
if(n == 1) msg = "新着情報";
if(n == 2) msg = "プロフィール";
if(flag == 0) top.rightWin.form.tarea.value = msg;
}
function kara(){
if(flag == 0) top.rightWin.form.tarea.value = "";
}
function idou(i){
flag = i;
}
//-->
</SCRIPT>
<BODY>
<A HREF="top.htm" TARGET="right" onMouseover="test(0);" onMouseout="kara();" onClick="idou(0);">トップページ</A>
<BR>
<A HREF="new.htm" TARGET="right" onMouseover="test(1);" onMouseout="kara();" onClick="idou(1);">What's New!</A>
<BR>
<A HREF="profile.htm" TARGET="right" onMouseover="test(2);" onMouseout="kara();" onClick="idou(1);">プロフィール</A>
</BODY>
</HTML>
・右フレーム
<HTML>
<BODY>
<FORM NAME="form">
<TEXTAREA COLS=50 ROWS=5 NAME=tarea></TEXTAREA>
</FORM>
</BODY>
</HTML>
==================== 画像関連 ====================
■画像の変更、画像の光る効果
・例1
<HTML>
<BODY>
<A HREF="../index.html" onMouseOver="img0();" onMouseOut="img1();">
<IMG SRC="go00.gif" BORDER=0></A>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
nimg0 = new Image();
nimg0.src = "go00.gif";
nimg1 = new Image();
nimg1.src = "go01.gif";
function img0(){
document.images[0].src = "go01.gif";
}
function img1(){
document.images[0].src = "go00.gif";
}
//-->
</SCRIPT>
</BODY>
</HTML>
・例2
<HTML>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
function fover(imgsrc){
imgsrc.src="jscript/image/go01.gif";
}
function fout(imgsrc){
imgsrc.src="jscript/image/go00.gif";
}
//-->
</SCRIPT>
<BODY>
<IMG SRC="jscript/image/go00.gif" onMouseOver="fover(this);" onMouseOut="fout(this);">
</BODY>
</HTML>
==================== 文字関連 ====================
■文字のスクロール
<HTML>
<BODY onLoad="textf();">
<FORM NAME="form">
<INPUT TYPE="text" NAME="box" SIZE=30>
</FORM>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
msg = " メッセージをスクロール。 ";
function textf(){
msg = msg.substring(2, msg.length) + msg.substring(0, 2);
document.form.box.value = msg;
setTimeout("textf()", 400);
}
//-->
</SCRIPT>
</BODY>
</HTML>
■文字のスクロール(時間別)
<HTML>
<BODY onLoad="textf();">
<FORM NAME="form">
<INPUT TYPE="text" NAME="box" SIZE=30>
</FORM>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
nd = new Date();
ndh = nd.getHours();
switch(ndh){
case 0:
msg = " 午前0時です。 ";
break;
case 1:
msg = " 午前1時です。 ";
break;
case 2:
msg = " 午前2時です。 ";
break;
//中略
case 22:
msg = " 午後10時です。 ";
break;
case 23:
msg = " 午後11時です。 ";
break;
}
function textf(){
msg = msg.substring(2, msg.length) + msg.substring(0, 2);
document.form.box.value = msg;
setTimeout("textf()", 400);
}
//-->
</SCRIPT>
</BODY>
</HTML>
■リンク別の文字表示
<HTML>
<BODY>
<FORM NAME="form">
<INPUT TYPE="text" NAME="box" SIZE=30>
<A HREF="index.htm" onMouseOver="textf(0);">リンク0</A>
<A HREF="event.htm" onMouseOver="textf(1);">リンク1</A>
<A HREF="script.htm" onMouseOver="textf(2);">リンク2</A>
</FORM>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
function textf(x){
if(x == 0) msg = "リンク0です。";
if(x == 1) msg = "リンク1です。";
if(x == 2) msg = "リンク2です。";
document.form.box.value = msg;
}
//-->
</SCRIPT>
</BODY>
</HTML>
==================== 時刻・時計関連 ====================
■時刻の表示(テキスト時計)
<HTML>
<BODY onLoad="clock();">
<FORM NAME="form">
<INPUT TYPE="text" NAME="box" SIZE=15>
</FORM>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
function clock(){
nd = new Date();
h = nd.getHours();
m = nd.getMinutes();
s = nd.getSeconds();
document.form.box.value = h + ":" + m + ":" + s;
setTimeout("clock()", 1000);
}
//-->
</SCRIPT>
</BODY>
</HTML>
■時刻の表示(画像時計)
<HTML>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
a = new Image();
a.src = "a.gif";
p = new Image();
p.src = "p.gif";
numa = new Array(9);
for(i=0;i<=9;i++){
numa[i] = new Image();
numa[i].src = i + ".gif";
}
function clock(){
nd = new Date();
h = "0" + nd.getHours();
m = "0" + nd.getMinutes();
s = "0" + nd.getSeconds();
h = h.substring(h.length-2, h.length + 1);
m = m.substring(m.length-2, m.length + 1);
s = s.substring(s.length-2, s.length + 1);
h0 = h.substring(0, 1);
h1 = h.substring(1, 2);
m0 = m.substring(0, 1);
m1 = m.substring(1, 2);
s0 = s.substring(0, 1);
s1 = s.substring(1, 2);
if(h0 + h1 < 12){
document.images[0].src = "a.gif";
}else{
document.images[0].src = "p.gif";
}
document.images[2].src = h0 + ".gif";
document.images[3].src = h1 + ".gif";
document.images[5].src = m0 + ".gif";
document.images[6].src = m1 + ".gif";
document.images[8].src = s0 + ".gif";
document.images[9].src = s1 + ".gif";
setTimeout('clock()', 1000);
}
//-->
</SCRIPT>
</HEAD>
<BODY onLoad="clock();">
<IMG SRC="a.gif"><IMG SRC="m.gif"><IMG SRC="0.gif"><IMG SRC="0.gif"><IMG SRC="c.gif"><IMG SRC="0.gif"><IMG SRC="0.gif"><IMG SRC="c.gif"><IMG SRC="0.gif"><IMG SRC="0.gif">
</BODY>
</HTML>