JavaScript

(1)概要

  HTMLファイルの中にプログラム(スクリプトという)を書いておく。そのファイルが読み込まれたとき、スクリプトはブラウザによって解釈され、クライアントマシン上で実行される。Netscape社が提案したもの。Sun Microsystems社が提案したJavaとは異なるもの。

 JavaScriptにより、Webページに、ちょっとした動きを与えることができる。たとえば背景の色を徐々に変化させたり、現在時刻を時計のように表示させたりできる。また、リンク(ホットテキスト)の上をカーソルが通過したときに、ちょっとした仕事をさせることができる。例えば、「ポップアップを表示する」設定にすれば、 解説を別ウインドウ表示 することができる。詳細にプログラミングすれば、将棋の指し手自動再生までできる。
 例:朝日新聞(将棋欄) http://www.asahi.com/shougi/

 参考文献:河西朝雄『JavaScript入門』技術評論社
 参考:他人のWebページの「ソース」を見る。
 参考:とほほのWWW入門 http://tohoho.wakusei.ne.jp/
 参考:Biglobeパワーアップ http://kingdom.biglobe.ne.jp/

(2)使い方

 0)HTMLファイルに、SCRIPTタグで囲み、プログラミングする。
 1)Body部分で、必要な場所に直接記述できる。
 2)Head部分で、あらかじめ名前をつけて定義し、Body部分でそれを引用できる。
 3)別ファイル(拡張子は、.js)で、あらかじめ名前をつけて定義し、Body部分でそれを引用できる。

 注意:スクリプト内の、命令行の行末には、必ずセミコロン;を書く。

(3)Body部分でのプログラム例:onMouseOverイベント処理

 必要な場所で、たとえば次のように記述する。
<span onMouseOver="javascript:window.alert('だめです')">「ここをクリックしないでね」</span>
すると、次のように表示される。
「ここをクリックしないでね」

 マウスカーソルを上記の文に合わせると、「だめです」という警告文が現れる。

(4)Head部分で定義しておく例

 Head部分で、次のように関数info(n)を定義しておく。
<SCRIPT>
<!--
   function info(n){
      w=window.open("bookinfo"+n+".html", "NewWindow");
}
// -->
</SCRIPT TYPE="text/javascript">
 また、Body部分で、次のように記述する。
 これに関する情報は、<A href="book1.html" onMouseOver="info(1)">書籍1</A>に詳しい。
 上記文章中の「書籍1」をクリックすると、book1.htmlが表示されるはずであるが、その前に、ポインタをそこにあわせるた瞬間にinfo(1)が実行され、書籍1に関する情報bookinfo1.htmlが別ウインドウ(ポップアップウインドウ)に表示される。
 TYPE="text/javascript"は、実は省略できる。スクリプト言語は、JavaScript以外にも、VBScriptがあり、切り替えて使いたいときにTYPE属性を用いる。しかし、VBScriptはクライアントがwindows OSの場合にだけ実行可能である。

(5)別ファイルで定義しておく例 参照:クライアント別表示変更

(6)フォーム内での利用例(加算プログラム)
 HTML(formタグ)によるFormの作成   参照:加算機FORM
 JavaScriptプログラミング  参照:加算機実行可能

 違い:実行可能にするために、ボタンにonClickイベントハンドラ(calc()を動かすもの)を付け加え、Head部分に、calc()の動作内容を記述した。eval関数は文字列を数値に変換する関数だ。

特徴  オブジェクト指向システムか?
1)フォームの部品に名前をつけることができる。→オブジェクト名。
2)各オブジェクトのvalueを読み書きできる。→プロパティー(属性)。
3)イベントに応じて処理できる。→イベントによるメソッドの起動。

(7)ビジネス利用例

 Webで商品を購入するとき、住所氏名などを記入する。書き忘れなどをチェックしてみたい。参照:入力項目チェック
注意:これで、CGIに値を渡すことができる。action=の中身がメソッドの内容だ。