画像を並べる関数

ブラウザの更新ボタンをクリックする度に個数が変わります。

【実行画面】

【Source Code】
<script type="text/javascript">
  function disp(n)
  { for(i=0; i<n; i++) 
      document.write("<img src='img/jewel.gif'>");
  }
</script>
</head>

<body>
<h1>画像を並べる関数</h1>
<h3>ブラウザの更新ボタンをクリックする度に個数が変わります。</h3>

<script type="text/javascript">
  n= Math.floor(Math.random() * 10)+1;
  disp(n);
</script>

Math.random() で石の個数を設定します。
ページ全体のソースコードは、右クリックから ソースの表示(V) で表示されます。
Math.random() は 0.0 以上 1.0 未満の乱数を発生させる関数です。
10倍して少数以下を切り捨て1を加えると、n は1~10の乱数になります。
disp(n); で画像を描画する関数を呼び出します。
<script type="text/javascript">
  n= Math.floor(Math.random() * 10)+1;
  disp(n);
</script>

n 個の画像を表示する disp(n) 関数です。
関数は <body> </body> の中で定義することも出来ますが、<head> </head> に書かれている例を良く見かけます。
今回も head の中で定義してみました。
今回は <!-- ・・・ // --> を省略して支障が無いかを試してみました。
<script type="text/javascript">
  function disp(n)
  { for(i=0; i<n; i++) 
      document.write("<img src='img/jewel.gif'>");
  }
</script>

前田稔の超初心者のプログラム入門
超初心者のプログラム入門(JavaScript)