プラウザを操作したり、HTMLやCSSを書き換えたりするには、JavaSciptでプログラムを書く必要があります。実際にプログラムを書く前にそもそもJavaScriptのプログラミングではどんなことをするのでしょうか？
イメージが大切
インプット→加工→アウトプット
プログラムで何をするのか、JavaScriptの書き方がわからなくてもかまいませんからまずはイメージをしてみましょう。たとえば
ショッピングサイトのお会計ページで、品物の数量を変えると小計の金額が変わるようにしたいと思います。
品物の単価は<td>小計は<span>タグで囲まれていることにしましょう。
さて、数量を変えたら小計が書き換わるには何をしたらよいでしょうか？
まず品物の単価を知る必要があります。それには単価欄の金額をとってくるとしましょう。とりあえず￥やカンマは無視します。数量はプルダウンメニューで設定されている値を持ってくることにします。
- １品物の単価をHTMLの中から取ってくる。
- ２設定されている数量をプルダウンから取ってくる。
- ３単価×数量を計算する
- ４計算結果でHTMLの一部を書き換える。
このうち１と２は「取ってくる」ステップです。小計を再計算するために必要な材料となるデータを取得します。このステップは処理に必応なデータを取ってくる「インプット」のステージということができます。
次の3で取ってきたデータを掛け算します。インプットされた値を「加工」して出したい結果を得るステージです。
最後の計算結果をページに表示するためにHTMLの一部を書き換えます。これはアウトプットのステージです。
インプット→加工→アウトプットがほとんどのJavaScriptのプログラムに共通する処理の流れです。お決まりのパターンと言っていいでしょう。
Apple Rooms laboratoryの運営者
