　English Example Sentences 英語の例文

《Javascriptの記述方法》

Javascriptを記述するには、htmlファイルのmetaタグにJavascriptの宣言を記述します。

<!DOCTYPE html>

<head>

<title>English Example Sentences</title>

</head>

※ "content-type"は、大文字と小文字を区別しないので"Content-Type"でも同じ。

Javascriptを記述方法には、html内部に記述する方法と、外部のテキストファイルに記述してから読込む2種類があります。

《html内部に記述する》

<html>

………

……この部分にJavascriptを記述する

</script>

………

</html>

《外部ファイルから読込む》

<html>

………

………

</html>

《色の指定方法》

Javascriptでは、htmlやcssでの色の指定と同じように、redやgreenやblueといった名前を指定する方法と、16進数の数値で指定する方法の2つがあります。背景色はbgColorで、前景色はfgColorというプロパティを使って設定します。

16進数の数値で指定するには、光の三原色である赤(Red)、緑(Green)、青(Blue)のRGB値を、それぞれを16進数00～ffで順に記述します。また、先頭に16進数であることを示す#を記述します。

#	33	44	55
	赤	緑	青

白(white)	#ffffff
黄(yellow)	#ffff00	赤 + 緑 = 黄
紫(purple)	#ff00ff	赤 + 青 = 紫
水色(cyan)	#00ffff	緑 + 青 = 水色
赤(red)	#ff0000
緑(green)	#00ff00
青(blue)	#0000ff
灰(gray)	#808080
黒(black)	#000000

《無名関数》

無名関数は、関数名がない関数のことで、一度しか実行する必要がない処理で使われます。

setTimeout(function(){

alert("5秒経過しました。");

}, 5000);

※ 5秒後に無名関数が実行されて「5秒経過しました。」と表示されます。

《主なイベントハンドラ》

Javascriptで用意されているonclickなどのイベントハンドラをリストにまとめました。

Event handler

《数値チェックについて》

テキストボックスなどで数値の妥当性をチェックする方法についてまとめました。

《乱数》

1から10までの乱数を生成する場合は、以下のように記述します。

var rand = Math.floor( Math.random() * 10 ) + 1;

《タイマー処理》

タイマー処理を使うと、スライドショーなど一定時間ごとに画像や文字が切り替わったりする動きを作成できます。タイマー処理には、setTimeout()とsetInterval()を使う2種類の方法があります。

《setTimeout》

………

function displayTimer(){

………

// 1秒後にdisplayTimer()が実行されるので、結果無限ループになる。

timerID = setTimeout("displayTimer()", 1000);

// タイマー処理を停止する場合は、clearTimeout(timerID)を使う。

}

</script>

《setInterval》

………

function displayTimer(){

………

}

// まずdisplayTimer()が実行され、この処理を1秒毎に繰り返す。

timerID = setInterval("displayTimer()", 1000);

// タイマー処理を停止する場合は、clearInterval(timerID)を使う。

</script>

タイマー処理を使ったサンプルプログラムです。

《OSとブラウザの判定》

navigator.userAgentからOSの情報を取得することができます。

navigator.userAgentの実行結果は以下です。

navigator.userAgentとnavigator.appVersionからブラウザの情報を取得することができます。

navigator.appVersionの実行結果は以下です。IEのバージョンを調べる時にappVersionを使います。

《Javascriptで配列名にnameを使用すると期待の動作をしない》

以下のように変数名をnameにしてしまうと、"curb"ではなく、"c"が表示される。

これはグローバル変数であるwindow.nameと衝突してしまうから起こるものである。 window.nameのwindowは省略できて、nameはString型であるため、結果としてname[0]だと文字列の0番目だけを取得してしまう。

var name = ['curb', 'detour', 'consecrate'];

alert(name[0]);

</script>

《Javascriptでテーブルを操作する》

テーブルの操作は、rowsオブジェクトでテーブルの行を操作できて、cellsオブジェクトでテーブルの列を操作できる。

var table = document.getElementById("sample");

// 行数取得

var rows_len = table.rows.length;

// 列数取得

var col_len = table.rows[0].cells.length;

Javascriptでテーブルを操作したサンプルプログラムです。

Javascriptによるテーブル操作

《ドラッグ＆ドロップ》

ドラッグ＆ドロップで画像ファイルを設定するサンプルを以下に示す。

ここに画像ファイルをドラッグ＆ドロップしてください。