JavaScript_javascript スキルを使用してクラスでランダムロールコールを実装する小規模アプリケーションのニーズの具体的な分析

要件は次のとおりです。

1. クラスのすべてのメンバーの名前を Web ページに表示します。

2. スタートボタンをクリックすると、人物の色が変わり始めます。停止すると、別の色の位置が表示されます。この位置がクリックされた生徒です。

おおよそのグラフィカル インターフェイスは次のとおりです。



以下は、上記の要件分析の具体的な分析です。

1このようなページを初期化し、統一色 -green を設定します。

a. クラスメートの名前を配列に保存します

b. div ブロックを使用してページに表示します

2. 位置をランダムに選択し、その色を - に変更します。 red

a. CSS スタイルを使用して色の変更を制御します

b. ランダム関数を使用してランダムな位置を生成します

3. アニメーション効果を与えるには、インターバル時間に応じて、色の変化の位置が後方に移動します。そして、前の位置の色を緑色に戻します。

a. div の色を変更するメソッドを設計する必要があり、同時に後方に移動するときに一定間隔で呼び出されるメソッドを呼び出す必要があります。次に、settimeout メソッドと setinterval メソッドがあります。 js から選択します

4. アニメーション効果は指定された時間内に停止する必要があり、停止位置は赤色のままです。

a. アニメーション効果は指定された時間内に停止します。これは、実際には上記のメソッドを停止することを意味します。 js でさまざまなメソッドを使用し、さまざまな実装形式を使用します

5. 特定の位置で停止すると、選択した生徒が誰であるかを示すダイアログ ボックスが表示されます。

a.Alert 関数は最終結果をポップアップ表示します。これで問題ありません。

次のセクションでは、この小さなアプリケーションを JavaScript コードで実装します。