これを実現するにはいろいろな方法があるが, 一番単純な方法は, 説明の文章をファイル名 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>
次に ２ 番目の方法を説明しよう. この方法では, 実行したい 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>