JavaScriptでの占いサイト

これから、予言を出力するサイトを作ります。 このサイトにはボタンを設置し、クリックすると タイマーが起動し、毎0.1秒ごとに、ある div要素に、1からある最大値までの乱数を 表示するようにしましょう。

そのdiv要素の下に別のボタンを設置し、 サイトのユーザーがクリックすると タイマーを停止し、div内の数字を確定できるようにします。 この数字が予言の番号となります。 その後、その番号に対応する予言をユーザーに表示し、 不要なボタンは画面から削除し、 ユーザーが複数の予言を得られないようにします。 つまり、1回のサイト訪問で1つの予言のみとします。

完成形のイメージは以下の通りです:

課題を解く際に使用できるHTML/CSSのコードは以下の通りです:

html<div id="parent">
  <div id="timer">?</div>
  <div id="text"></div>
  <button id="start" class="active">自分の運勢を知る</button>
  <button id="stop">予言を受け取る</button>
</div>
css#parent {
  text-align: center;
}
#parent > * {
  margin-bottom: 10px;
}

#timer {
  font-size: 18px;
}
#text {
  font-size: 17px;
  font-style: italic;
}

button {
  padding: 5px 10px;
  font-size: 15px;
  cursor: pointer;
}
button:not(.active) {
  display: none;
}
Задание 1

予言をどのように保存すると便利か、考えてみてください。

Задание 2

説明されたサイトを実装してください。

Задание 3

予言を2種類(良い予言と悪い予言)にし、 悪い予言は赤色、良い予言は緑色で表示されるようにしてください。