ホーム>Web デザインのチュートリアル>WEB標準化

Javascript で最も一般的に使用される 55 の古典的なテクニック (3)

著者：Eve Cole 更新時間：2009-12-14 15:53:58

44. ページの開き方と移動

次のコードを <body> 領域に追加します。

<スクリプト言語="JavaScript">
<!-- 開始
for (t = 2; t > 0; t--) {
for (x = 20; x > 0; x--) {
for (y = 10; y > 0; y--) {
親.moveBy(0,-x);
}
}
for (x = 20; x > 0; x--) {
for (y = 10; y > 0; y--) {
親.moveBy(0,x);
}
}
for (x = 20; x > 0; x--) {
for (y = 10; y > 0; y--) {
親.moveBy(x,0);
}
}
for (x = 20; x > 0; x--) {
for (y = 10; y > 0; y--) {
親.moveBy(-x,0);
}
}
}
//-->
// 終了 -->
</script>

45. 個人クライアントマシンの日時を表示する

<スクリプト言語="LiveScript">
<!-- 非表示
今日 = 新しい日付()
***("現在の時刻: ",today.getHours(),":",today.getMinutes())
***(" <br>今日の日付は次のとおりです: ",today.getMonth()+1,"/",today.getDate(),"/",today.getyear());
// コンテンツの非表示を終了 -->
</script>

46. 毎回、最終変更日を自動的に生成します。

<html>
<本文>
これは単純な HTML ページです。
<br>
最終変更:
<スクリプト言語="LiveScript">
<!-- 古いブラウザからスクリプトを非表示にします
***(document.lastModified)
// コンテンツの非表示を終了 -->
</script>
</body>
</html>

47. 空にすることはできず、電子メール アドレスの制約があります:

<html>
<頭>
<スクリプト言語="JavaScript">
<!-- 隠す
関数 test1(フォーム) {
if (form.text1.value == "")
alert("何も書いていないので、もう一度入力してください!")
それ以外 {
alert("こんにちは"+form.text1.value+"! 入力が完了しました!");
}
}
関数 test2(form) {
if (form.text2.value == "" ||
form.text2.value.indexOf('@', 0) == -1)
alert("これは正しい電子メール アドレスではありません。もう一度入力してください。");
elsealert("入力が完了しました!");
}
// -->
</script>
</head>
<本文>
<form name="first">
あなたの名前を入力してください: <br>
<input type="text" name="text1">
<input type="button" name="button1" value="入力テスト" onClick="test1(this.form)">
<P>
電子メール アドレスを入力してください: <br>
<input type="text" name="text2">
<input type="button" name="button2" value="入力テスト" onClick="test2(this.form)">
</body>

48.マーキー

<html>
<頭>
<スクリプト言語="JavaScript">
<!-- 隠す
var scrtxt="どうですか! クールです! あなたも試してみてください。"+"ここに訪問者へのメッセージが入ります。
このページは "+"純粋に魅了されて何時間も見続けるでしょう...";
var lentxt=scrtxt.length;
var幅=100;
var pos=1-幅;
関数スクロール() {
pos++;
var スクロール = "";
if (pos==lentxt) {
pos=1-幅;
}
if (pos <0) {
for (var i=1; i <=Math.abs(pos); i++) {
スクローラー=スクローラー+" ";}
スクロール=スクロール+scrtxt.substring(0,width-i+1);
}
それ以外 {
スクロール=スクローラー+scrtxt.substring(pos,width+pos);
}
window.status = スクローラー;
setTimeout("scroll()",150);
}
//-->
</script>
</head>
<body onLoad="scroll();return true;">
あなたのウェブページをここに表示できます!
</body>
</html>

49. Web ページのボタンを使用して、前のページ、次のページ、およびホームページの表示を制御します。

<html>
<本文>
<フォーム名="ボタンバー">
<INPUT TYPE="ボタン" VALUE="戻る" onClick="history.back()">
<INPUT TYPE="button" VALUE="JS- ホーム" onClick="location='script.html'">
<INPUT TYPE="ボタン" VALUE="次へ" onClick="history.forward()">
</FORM>
</body>
</html>

50. ウェブサイトのソースコードを表示する

次のコードを <body> 領域に追加します。

<スクリプト>
関数追加()
{
var ress=document.forms[0].luxiaoqing.value
window.location="ビューソース:"+ress;
}
</スクリプト>
ソース コードを表示する URL アドレスを入力します。
<FORM> <input type="text" name="luxiaoqing" size=40 value="http://"> </FORM>
<フォーム> <br>
<INPUT type="button" value="ソース コードを表示" onClick=add()>
</FORM>

51. タイトルには日付が表示されます

次のコードを <body> 領域に追加します。

<スクリプト言語="JavaScript1.2">
<!--非表示
var isnMonth = 新しい
Array("1 月"、"2 月"、"3 月"、"4 月"、"5 月"、"6 月"、"7 月"、"8 月"、"9 月"、"10 月"、"11 月"、"12 月") ;
var isnDay = 新しい
Array("日曜日","月曜日","火曜日","水曜日","木曜日","金曜日","土曜日","日曜日");
今日 = 新しい日付 () ;
年=today.get Year();
日付=today.getDate();
if(ドキュメント.すべて)
document.title="今日は: "+年+"年"+isnMonth[today.getMonth()]+日付+"日"+isnDay[today.getDay()]
//--非表示-->
</script>

関連記事