xrea-banner xreaad

Hello, script!

namespace kilrey; / JavaScript / 基本 / Hello, script!

前のページ(Hello, prototype chain!)へ / 次のページ(Hello, DOM!)へ

ここから先はJavaScriptの話というよりは ブラウザ付属の実装の話になります。 html中での色々なJavaScriptの書き方です。 今まではhead中のscriptタグ内に書いてきましたが、 他の場所にも書くことが出来ます。 (Hello, script! Sample 1)

<html>
  <head>
    <script type="text/javascript">
      alert("Hello, html/head/script!");
    </script>
  </head>
  <body onload="alert('Hello, html/body/onload!');">
    <script type="text/javascript">
      alert("Hello, html/body/script!");
    </script>
  </body>
</html>
    

この場合、html/head/script -> html/body/script -> html/body/init という順番に実行されます。 基本的には

  1. scriptタグは上から順に実行される
  2. onloadイベントはそのタグの読み込みが終わったタイミングで実行される

のようになっています。 動的にscriptタグを書き込んだらどうなるのか、 など興味深い例はありますが、それは追々試してみましょう。

スクリプトは外部ファイルに記述することも出来ます。 ここでは大したことはしていませんが、 大規模なスクリプトを組む場合には 外部ファイルを使った方がシンプルにまとめられます。 また複数のhtmlファイルから 一つの外部JavaScriptファイルを読み込んだ場合、 キャッシュが有効ならば二回目以降の読み込みが省略されます。 大型のライブラリを使用している場合や 通信回線が細い場合にはその違いが体感できるでしょう。 (Hello, script! Sample 2)

<html>
  <head>
    <script src="src.js">
    </script>
  </head>
</html>
    

( 外部ファイル )

alert("Hello, src.js!");
    

前のページ(Hello, prototype chain!)へ / 次のページ(Hello, DOM!)へ