A.T-MOON

contents

パンくずリスト

JavaScriptとは

JavaScriptとは

JavaScript≠ニはNetscape社によって作成されたブラウザー上で実行できるスクリプトで言語で
(※サーバー上で動作するスクリプトにはCGI≠ネどがあります。)
HTML文書と組み合わせて記述することによりWebページに動きを与えることができます。
現在の時刻を表示したり、訪問者情報を取得して表示したりすることもできます。
JavaScriptを使ってサイトに動きを加えてみましょう。

ページTOP
ひとつ前のページに戻る

JavaScriptの種類

@<head>〜</head>内や<body>〜</body>内に直接挿入して使用する場合。
A外部にJavaScriptのファイルを作りリンクする場合。(外部JavaScriptファイル)
があります。
実行させたいスクリプトを直接ページ内に書き込んだり
あるいは、外部に作ったJavaScriptファイルにリンクを貼って実行させたりします。
沢山のページで同じスクリプトを使う場合などは外部JavaScriptファイルを作りリンクさせた方がよいでしょう。
ページTOP
ひとつ前のページに戻る

JavaScriptの記述方法

<head>〜</head>や<body>〜</body>内に記述
<script type="text/javascript">
 <!--

 ココにJavaScriptの構文を記述
 //-->
</script>

<!-- //-->はJavaScriptを実行できない環境の場合、
間に書かれている文字を表示させないためのものなので
必ず入れるようにしてください。(外部ファイルでは不要

外部JavaScriptファイルに記述
<script type="text/javascript">
 ココにJavaScriptの構文を記述
</script>
<!-- //-->はJavaScriptを実行できない環境ではファイルの読み込み行わないので書きません。
記述したJavaScriptファイルを『***.js』という名前で保存し(***は任意の名前)
HTML文書の読み込みたい部分に<script src="***.js" type="text/javascript">と書き込み
ファイルを読み込みます。

又、JavaScriptを実行できない環境のために
<noscript>
 ココに代替のHTMLを記述
</noscript>
というようにJavaScriptが実行できない環境でも表示がおかしくならないように
代替のHTMLを記述しておくと良いでしょう。
ページTOP
ひとつ前のページに戻る

JavaScriptの基本構文

┌────────── JavaScript構文 ──────────┐
var ○○;変数がない場合変数○○を作成

オブジェクト作成

○○ = new XX();New演算子
◎ = ○○.getXX();変数
document. write ("こんにちわ");
document. write ("これは ",◎," です");
オブジェクト プロパティ └───パラメーター───┘
└──―─メソッド─―──┘

例えば
文房具を作る工場(A)で鉛筆(B)が作られています。
出来上がった○○鉛筆(C)を作り上げるための作業(D)として
原料に黒鉛(E)が使われていて芯を作り、木の棒の中に格納(F)されています。

といった感じになります。

A=工場オブジェクトです。
 ページに関わる色々なものを制御します。
 上の例の場合、文房具を作る工場ですよ〜って事です。
 オブジェクトには状態を変更するためのプロパティ
 あらかじめ用意されている命令メソッドがあります。

B=何がされるのかプロパティです。
 オブジェクトの属性でオブジェクトで何をどうするか?≠フどうするか?≠フ部分です。
 上の例の場合は作られる!ですね。

C=出来上がったものパラメーターです。
 この部分がスクリプトが実行された時の結果として表示されます。
 鉛筆が出来上がったわけですね。

D=作るための作業オブジェクト生成です。
 もともとあるオブジェクトもありますが自分で作る場合演算子などを用いてオブジェクトを作ります。
 
E=原料がNew演算です。
 原料をココで用意します。  芯を作るための黒鉛ですね。それをココで用意します。

E=木の棒が変数です。
 値や式やオブジェクトを格納します。
 格納したものを参照し引用することでスクリプトが簡潔になります。

オブジェクト.メソッド(パラメーター);オブジェクト.プロパティ=値;で構成されています。
それぞれ色々なオブジェクトやプロパティ、メソッドなどが沢山あります。
色んな言葉が沢山出てきますが一度に覚えようとせず、実際に使っていく上で徐々に覚えていきましょう。

別のページでそれぞれの解説をしていきますが、まずは簡単な構文を覚えましょう。

例として『はじめまして』という文字を書き出す構文を見てみましょう。
A=document工場が、B=writeを作り、商品がC=はじめましてです。
というようなものを表現します。
<script type="text/javascript">
 <!--
 document.write("はじめまして");
  //-->
</script>

という具合に表示されます。
では、もう一歩掘り下げてみましょう。

『今日は○日です』という日付の表示です。この場合日付を取得しなくてはいけません。
A=document工場が、B=writeを作り、商品がD=今日はG日です。Gの原料はFです。
となります。わかりますか?(笑)
<script type="text/javascript">
 <!--
 today = new Date();
 t = today.getDate();
 document.write("今日は",t,"日です");

  //-->
</script>

という具合に表示されます。

今日の日付を取得するために日付オブジェクトを生成しなくてはいけません。
それがtoday = new Date();の部分です。日付オブジェクトを作る原料になる部分ですね。
これをNew演算子といいます。
ここで生成された値を表示するために変数を使って格納します。
それがt = today.getDate();の部分です。変数tに格納しました。
そしてそれを",t,"で参照させます。
そうすると日付オブジェクトで取得した日付が表示されるわけです。
これがJavaScriptの基本的な構文になります。

ややこしいですが?(笑)
ややこしいですよね(苦笑)

いろんな言葉が出てきましたが、次のページでそれぞれの言葉の意味を説明していきます。

ページTOP
ひとつ前のページに戻る
JavaScript indexへ戻る前のページ 次のページ準備中