ＪａｖａＳｃｒｉｐｔオブジェクト概観

documentオブジェクト

１　documentオブジェクト概観

documentオブジェクトは<body>...</body>部分を表すオブジェクトです。
<body>...</body>内に記述されたformや更にHTML文のタグは、みなdocumentオブジェクトの下の、
子オブジェクト、孫オブジェクトになります。
まず、documentオブジェクトを概観しておきましょう。

Document －－　Links
　　　　　　　　　｜
　　　　　　　　　　－　Forms　　－－　textarea, checkbox, radio, submit
　　　　　　　　　｜　　　　　　　　　　　　button, radio, options
　　　　　　　　　　－　Anchors
　　　　　　　　　｜
　　　　　　　　　　－　Images

documentオブジェクトの子オブジェクトには以下のようなものがります。
links　現在の<body>...</body>文書内にあるハイパーリンク
forms　現在の文書内にあるform
anhcors　現在の文書内にあるアンカー
images　現在の文書内にあるイメージ（<img>タグ）

これらの子オブジェクトは配列になっており、文書内の何番目のオブジェクトという形で指定することができます。
例えば、文書内の最初のイメージは（添え字は0から始まることに注意）
document.images[0]

（formsの下にある）孫オブジェクトも、textarea,checkbox,radio,submit,button,radio,optionsとたくさんありますが、
これらは別の機会に触れたいと思います。

２　documentオブジェクトのプロパティとメソッド
（１）プロパティ
プロパティには以下のようなものがあります

alinkColor　アクティブリンクの色
bgColor　　背景色
cookie　　　クッキーの内容
fgColor　　文字色
lastModified　　現在文書の最終更新日
linkColor　　デフォルトのリンクカラー
location　　現在文書のURL
referrer　　呼び出し元（リンク元）のURL
title　　　　　タイトルの内容（<title>..</title>の文字列）

（２）　メソッド
メソッドには以下のようなものがあります。

clear()
open()
close()
toString()
write()/writeln()

３　documentオブジェクトを使ってみる
いくつか、実際によく使うオブジェクトを使ってみます。
（１）背景色をかえる
背景色を変える場合は、プロパティbgColorに色を指定します。
色はカラーネーム（red,yellow,blue,white,black等）で指定するか、RGB値をRRGGBB形式で指定します。
背景を緑にしたい場合は、以下のように記述します。
window.document.bgColor="green";

では、HTML文の中での、実際の記述の仕方をあげておきます。
ウィンドウをクリックするたびに、背景が赤と緑、猫がしろねこと黒ねこにかわります。
<< 実例（クリックで背景と画像を変える） >>

<HTML>
<HEAD></HEAD>
<BODY bgColor="red" onClick="change()">
<SCRIPT Language="JavaScript">

</SCRIPT>
<br><hr>
ウィンドウをクリックするたびに、背景とねこがかわります
<img src="catwh.gif" name="myImage">
<br><hr>
</BODY>
</HTML>

背景赤、　クリックで change() 関数の呼び出し

変数ｆ　＝０の時　　背景緑、猫白ねこ
　　　　　＝１の時　　背景赤、猫黒ねこ

image オブジェクトとして<img> タグの中で name で定義したmyImage を使用

Ｎａｍｅ属性で、この<Ｉｍｇ> タグの名前を myImage に設定

下の例はちょっと凝って、タイマーを使って自動的に背景色を変えていくJavaScriptです。
setTimeout()が指定したインターバルで関数を呼び出すタイマーです。
下の例では、1/1000秒毎にchangebgcolor()関数を呼び出す設定にしている。
実例は背景の色を徐々に変化させる

（２）　文字色をかえる
文字色を変える場合は、プロパティfgColorで色を指定します。
文字色を緑色に変える場合は以下の通りになります。
window.document.fgColor="green";

実例は文字色を変える

（３）　リンク元を表示する。
リンク元はプロパティreferrerで参照できます。
リンク元がローカルファイルの場合や、URLを直打ちでとんできた場合はNULL値が返され、それ以外は
リンク元URLが返されます。

JavaScriptでHTML文書内に動的にデータを書き込むには、以下のメソッドで書き出すことができまう。
document.open();　でテキストストリームを開きます。
document.write();　でデータを書き出します。
document.close();　でテキストストリームを閉じます。

以下、リンク元を表示するJavaScriptです。実例はリンク元を表示

<SCRIPT Language="JavaScript">

</SCRIPT>

TopPage