これを実現するにはいろいろな方法があるが, 一番単純な方法は, 説明の文章をファイル名 index.html でセーブし, JavaScript のファイルを別の名前, たとえば myprog.html でセーブする. そして, index.html の方をより myprog.html を 次のように アンカータグでリンクする.
ファイル index.html <html> <body> 1 から 10 の平方根の表を見るには <a href="myprog.html"> ここ </a> をクリック. <br> <font color="red"> 表示 </font> メニューの <font color="red"> 文書のソース </font> を選択すると, このファイルの HTML ソースファイルを見ることができます. <br> <br> 数学科, 高山 (作成 2001 年 5 月 30 日) </body> </html>
そしてファイル myprog.html には次のように JavaScript のプログラムを書いておく.
<script language="JavaScript"> for (i=1; i<=10; i++) { document.write(i," の平方根は ", Math.sqrt(i),"<BR>"); } </script>
次に 2 番目の方法を説明しよう. この方法では, 実行したい JavaScript の一連の手続きを ``関数'' として登録して, form タグの onClick 属性を 利用する方法である.
<html> <body> <script language="JavaScript"> function makeAtableOfSquares() { var i; for (i=1; i<=10; i++) { document.write(i," の平方根は ", Math.sqrt(i),"<BR>"); } } </script> <br> <br> 下のボタンをクリックすると 1 から 10 の平方根の表がみれます. <form> <input type="button" onClick="makeAtableOfSquares()"> 平方根の表 </form> このように <font color="blue"> JavaScript </font> の手続きを関数として登録することにより <font color="blue"> HTML </font> ファイルより JavaScript を実行させることが可能です. <br> <font color="red"> 表示 </font> メニューの <font color="red"> 文書のソース </font> を選択すると, このファイルの HTML ソースファイルを見ることができます. <br> <br> 数学科, 高山 (作成 2001 年 5 月 27 日) </body> </html>
レポートの web page についての注意:
この講義では ``プログラムって何?'' というのを理解してもらうために,
while ループを利用してレポートを書いてもらったが,
それを web page に張り付ける場合は,
ループにあたる部分が無限に実行されないように配慮しよう.
たとえば, 次のようなプログラムは web page に張るには不親切であろう.
一旦 while ループに入り込むと利用者は抜ける方法がなかなかわからない.
<script langulate="JavaScript"> n = -1; while (n != 0) { n = eval(prompt(0,"入力した数の平方根を求めます.")); document.write(Math.sqrt(n),"<br>"); } </script>このプログラムは次のようにしておいた方がずっといい.
<script langulate="JavaScript"> n = eval(prompt(0,"入力した数の平方根を求めます.")); document.write(Math.sqrt(n),"<br>"); </script>