栗林ゆき絵
á → 'a
í → 'i
ú → 'u
é → 'e
ó → 'o
ñ → ~n など
*主要なタグ
FORM (フォーム)
IMPUT TYPE="☆" (☆: radio=ラジオボタン、button=ボタン、text=テキストボックス)
NAME(フォーム全体や各部品の名前)
VALUE(値)...ボタンの場合は表示文字列。テキストボックスの場合は入力文字列。ラジオボタンの場合はあらかじめ定義した文字列。
onClick(クリック時のイベント処理)
*基本のアルゴリズム...文字列マッチ。配列要素の番号を利用した出力。
1.ユーザ入力... ラジオボタンで変換方向を選択。単語を入力。検索ボタンをクリック。
↓
2.西日か日西かの確認... function radio1(){ } でラジオボタンの値を取得。
↓
3.訳語表示(1)...西日ならば、スペイン語の配列を1個目(=0番目)から検索し、入力単語と一致したところで、 それと同じ番号の日本語の配列の要素(単語)を、出力用テキストボックスの値にセットする。
↓
4.訳語表示(2)... 日西ならば、日本語の配列を1個目(=0番目)から検索し、入力単語と一致したところで、 それと同じ番号のスペイン語の配列の要素(単語)を、出力用テキストボックスの値にセットする。
*主要なJavaScriptの項目★プログラム理解のコツ... 変数はデータを入れる箱、配列は箱の並び、とイメージするとよい。
文末はセミコロン ;
var 変数の宣言(変数名は自由につけてよい。サンプルではrv)
var x = new Array() 配列の宣言 (配列名は自由につけてよい。左の例ではx。要素番号(x[i]のi)は0始まり。)
function 関数の定義(関数名は自由につけてよい。サンプルではradio1(r)、translate()。rは引数。)
if(A){ B } 条件分岐1(もしAが成立すれば、Bを実行)
else if(C){ D } 条件分岐2 (そうではなくてCが成立すれば、Dを実行)
for(A){B} 繰り返し (Aの条件が成立する間、Bを実行)(iはカウンタ変数。配列の要素番号を管理する)
toLowerCase() 大文字を小文字に変換する。大文字が入力されても小文字データにマッチさせるために使用。(文字列オブジェクトのメソッド)
1.「単語帳1」(kadaiseiwa1.html)を大文字小文字の区別なく検索できるようにする。(大文字で入力された場合は小文字に変換) ⇒大文字にも対応。文字列比較時の入力文字列に.toLowerCase()をつける if(edic[i] == document.Myform.input.value.toLowerCase()){ document.Myform.output.value = jdic[i]; }2.「単語帳1」 「動物編」を拡張。(「十二支編」または「基本語彙編」など。(授業中に指示します)) 「辞書検索」「クリア」「ホーム」のボタンをスペイン語に。 3.単語を追加。(基本語彙編の場合は合計20語以上)◎全員で実習!! * スペイン語と日本語を同時に追加すること。 * 単語を増やしたら、for文の繰り返し回数も単語数に合わせて書き換えること。 * 5語ごとくらいに語数カウントのための改行を入れておくと便利(動作には影響しません) 以上ができたら、スペイン語→日本語、日本語→スペイン語、の双方向でテスト。 アクセント符号や、ñの入力・表示も確認すること。 3.「単語帳4」(kadaiseiwa4.html)情報処理用語編を同様に各自で作成。30語以上。 4.余力のある人は... (1)リンク先の「単語帳1」「単語帳4」の各ページのボタンの表示(辞書検索、クリア、等)をスペイン語に書き換え。 (2)リンク先の各ページにも「最終更新日」表示を追加。 (3)日⇒西検索時に、日本語入力が漢字・ひらがな・カタカナのいずれの表記であっても正しいスペイン語訳が出るようにする。 その他、下記 ◎課題欄の条件に従ってください。 |
©Yukie Kuribayashi