JavaScript記述の２つの基本形

JavaScript記述の基本形（1）

WebページでJavaScriptを実行する基本形の1つは、例えば、HTMLファイルの<head>要素内にスクリプトを書くというものである。

<html>
<head>
<title>タイトル</title>
....

<script type="text/javascript">
    ....
   JavaScriptの記述
    ....
</script>

</head>

<body>
....


....
</body>
</html>

たとえば、JavaScriptを使って、Webページ内に「これはJavaScriptで書き出されました。」を表示するには次の内容にでHTMLファイルを作成する。

<html>
<head>
<title>超簡単なJavaScript(1)</title>
<script type="text/javascript">
document.write("これはJavaScriptで書き出されました。");
</script>
</head>

<body>
</body>
</html>

問題1： 上のようなHTMLファイル（例えば、ファイル名 sample.html）を書いて、Webブラウザで表示させてみなさい。今の場合、<body>要素には何もないのに、ページ内に文字列「これはJavaScriptで書き出されました。」が表示されることに注意されたい。
文字化けは発生していないだろうか？

問題2： さらに改行して、「いかがでしょう？」をJavascriptを使って表示させるにはどうすればよいか。
ヒント：スクリプトとして次の2行としてみよう。

document.write("これはJavaScriptで書き出されました。" + "<br />");
document.write("いかがでしょう？");

JavaScript記述の基本形（2）

WebページでJavaScriptを実行する基本形のもう1つは、 <head>要素内でjavascriptを記述したファイル（たとえば script.js）を別に用意しておき、次のように読み込んだHTMLファイル（例えば、ファイル名 sample2.html）を作成するというものである。

<html>
<head>
<title>超簡単なJavaScript(2)</title>
<script type="text/javascript" src="script.js">
</script>
</head>

<body>
</body>
</html>

ファイル script.js には、たとえば次のように書いておく。

document.write("これはJavaScriptで書き出されました。");

問題3： 上のようなファイル script.js とHTMLファイル sample2.htmlを書いて、Javascriptを実行させてみなさい。

スクリプト本体を別ファイルとしておくと、HTMLファイル内もスッキリとし、スクリプトを記述したファイルを編集・保存することで、HTMLファイルを再読み込みして新たなJavascriptを実行することができる。

問題4： スクリプトファイル script.js で、さらに改行して「いかがでしょう？」を表示させるに編集し、編集したJavascriptを実行してみなさい。