No1.javascriptを使ってみる

javascriptの開発環境を作りましょう・・・
といってもjavascriptはブラウザ上で動くためブラウザさえあれば実行できるのです。(nodejsを使えばCUIでも実行可)

あとはお気に入りのエディタでソースを書くだけ。

おすすめはvim、atomあたりです。コードが綺麗に表示されるエディタを選びましょう。

とりあえず「メモ帳を使います!!!」 ということでなければいいかと思います。

Step 1.アラートを表示する!

下記ソースをhello.htmlで保存して、ファイルをダブルクリックして開きます。

<!-- HTMLのコメント:はじめてのjavascript実行! -->

hello, js

<script>
       alert("hello, javascript!!");
    </script>
javascript練習中〜

上図のようにポップアップで「hello, javascript!!」が表示されたかと思います。
javascriptはhtmlのscriptタグの中に書きます。外部ファイル(.js)にしておいて、ファイルを読み込んで実行することもできます。
基本的には外部ファイルにしておいたほうが管理が楽なので、外部ファイルにしておいたほうがいいと思います。
ソースでやっていることは、javascript標準のalert関数を呼び出して、パラメータとして文字列(hello, 〜)を渡して、それを表示しています。

次は外部ファイルにしてみましょう!

Step 2.外部ファイルに分割する

ファイル分割をして、さっきのアラートを表示してみましょう。
htmlファイルは先ほどのファイルをコピーして作って大丈夫です。

下記をhoge.jsで保存します。

alert("hello, javascript!!");
alert("外部に分割してみたよ");
alert("テステス");

下記をtest.htmlで保存します。

<!-- HTMLのコメント:分割ファイルの読み込み -->

hello, js

<script src="./hoge.js"></script>
javascript練習中〜

さっきと同じようにアラートが表示されます。
今回は3つ書いているので3つでてきます。scriptタグのsrc属性でファイルの位置を指定しています。
今回は相対パスで指定しています。hoge.jsはtest.htmlと同じ場所に置きましょう。
相対パス・絶対パスはいろいろ作業する時に意識するところなので、意味が分からない場合は調べておきましょう。