こんにちは、世界！

このチュートリアルのこの部分は、JavaScriptのコア、つまり言語自体についてです。

しかし、スクリプトを実行するには動作環境が必要であり、この書籍はオンラインであるため、ブラウザは良い選択です。別の環境（Node.jsなど）に集中する場合に時間を無駄にしないように、ブラウザ固有のコマンド（alertなど）の量は最小限に抑えます。チュートリアルの次の部分では、ブラウザでのJavaScriptに焦点を当てます。

まず、スクリプトをWebページに添付する方法を見てみましょう。サーバーサイド環境（Node.jsなど）では、"node my.js"のようなコマンドでスクリプトを実行できます。

「script」タグ

JavaScriptプログラムは、<script>タグを使用して、HTMLドキュメントのほぼどこにでも挿入できます。

例えば

<!DOCTYPE HTML>
<html>

<body>

  <p>Before the script...</p>

  <script>
    alert( 'Hello, world!' );
  </script>

  <p>...After the script.</p>

</body>

</html>

上記のボックスの右上隅にある「再生」ボタンをクリックすると、例を実行できます。

<script>タグには、ブラウザがタグを処理するときに自動的に実行されるJavaScriptコードが含まれています。

最新のマークアップ

<script>タグには、今日ではめったに使用されないが、古いコードにはまだ見られる属性がいくつかあります。

type属性：<script type=…>

古いHTML標準であるHTML4では、スクリプトにtypeが必要でした。通常はtype="text/javascript"でした。 artık gerekli değil. また、最新のHTML標準では、この属性の意味が完全に変更されました。今では、JavaScriptモジュールに使用できます。しかし、それは高度なトピックなので、チュートリアルの別の部分でモジュールについて説明します。

language属性：<script language=…>

この属性は、スクリプトの言語を示すことを意図していました。JavaScriptがデフォルトの言語であるため、この属性はもはや意味がありません。使用する必要はありません。

スクリプトの前後のコメント

本当に古代の本やガイドでは、次のように<script>タグ内にコメントが見つかる場合があります。

          <script type="text/javascript"><!--
    ...
//--></script>
        

このトリックは、最新のJavaScriptでは使用されていません。これらのコメントは、<script>タグの処理方法を知らなかった古いブラウザからJavaScriptコードを隠します。過去15年間にリリースされたブラウザにはこの問題がないため、この種のコメントは、本当に古いコードを識別するのに役立ちます。

外部スクリプト

JavaScriptコードが大量にある場合は、別のファイルに配置できます。

スクリプトファイルは、src属性を使用してHTMLに添付されます

<script src="/path/to/script.js"></script>

ここで、/path/to/script.jsは、サイトルートからのスクリプトへの絶対パスです。現在のページからの相対パスを指定することもできます。たとえば、src="script.js"は、src="./script.js"と同様に、現在のフォルダにあるファイル"script.js"を意味します。

完全なURLも指定できます。例えば

          <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.js"></script>
        

複数のスクリプトを添付するには、複数のタグを使用します

          <script src="/js/script1.js"></script>
<script src="/js/script2.js"></script>
…
        

原則として、最も単純なスクリプトのみがHTMLに配置されます。より複雑なものは、別のファイルにあります。

別のファイルの利点は、ブラウザがそれをダウンロードしてキャッシュに保存することです。

同じスクリプトを参照する他のページは、ダウンロードする代わりにキャッシュから取得するため、ファイルは実際には一度だけダウンロードされます。

これにより、トラフィックが削減され、ページの速度が向上します。

単一の<script>タグに、src属性と内部コードの両方を含めることはできません。

これは機能しません

          <script src="file.js">
  alert(1); // the content is ignored, because src is set
</script>
        

外部の<script src="…">またはコードを含む通常の<script>を選択する必要があります。

上記の例は、動作するように2つのスクリプトに分割できます

          <script src="file.js"></script>
<script>
  alert(1);
</script>
        

まとめ

<script>タグを使用して、JavaScriptコードをページに追加できます。
type属性とlanguage属性は必須ではありません。
外部ファイルのスクリプトは、<script src="path/to/script.js"></script>で挿入できます。

ブラウザスクリプトとそのWebページとの相互作用については、さらに多くのことを学ぶ必要があります。しかし、このチュートリアルのこの部分はJavaScript言語に特化しているため、ブラウザ固有の実装に気を取られるべきではないことに注意してください。ブラウザをJavaScriptを実行する方法として使用します。これはオンラインで読むのに非常に便利ですが、多くの方法の1つにすぎません。

こんにちは、世界！

「script」タグ

最新のマークアップ

外部スクリプト

まとめ

タスク

アラートを表示する

外部スクリプトでアラートを表示する

コメント

章

レッスンナビゲーション