JavaScript實現班級隨機點名小應用需求的具體分析_javascript技巧
來源:懂視網
責編:小采
時間:2020-11-27 21:23:09
JavaScript實現班級隨機點名小應用需求的具體分析_javascript技巧
JavaScript實現班級隨機點名小應用需求的具體分析_javascript技巧:需求如下: 1.在網頁中顯示,班級所有人員的名字。 2.點擊開始按鈕,人員的顏色開始變化,當停止的時候,會有一個顏色不同的位置,那么這個位置就是被點到的同學了。 大致的圖形界面如下: 下面是對上面的需求分析的具體分析如下: 1.初始化這樣一個頁面,并
導讀JavaScript實現班級隨機點名小應用需求的具體分析_javascript技巧:需求如下: 1.在網頁中顯示,班級所有人員的名字。 2.點擊開始按鈕,人員的顏色開始變化,當停止的時候,會有一個顏色不同的位置,那么這個位置就是被點到的同學了。 大致的圖形界面如下: 下面是對上面的需求分析的具體分析如下: 1.初始化這樣一個頁面,并

需求如下:
1.在網頁中顯示,班級所有人員的名字。
2.點擊開始按鈕,人員的顏色開始變化,當停止的時候,會有一個顏色不同的位置,那么這個位置就是被點到的同學了。
大致的圖形界面如下:

下面是對上面的需求分析的具體分析如下:
1.初始化這樣一個頁面,并設置統一顏色-green。
a.同學的名字,用數組存儲
b.在頁面用div塊顯示
2.隨機選擇一個位置讓其顏色變化成-red
a.顏色的變化用css樣式去控制
b.隨機的位置用隨機函數去生成
3.為了讓其有動畫的效果,設置間隔時間讓其顏色變化的位置向后移動。并且將上一個位置的顏色,恢復成綠色。
a.需要設計一個方法,讓div的顏色產生變化,同時向后移動應該調用一個間隔時間調用的方法,那么js中有settimeout,setinterval方法可供選擇使用
4.動畫的效果,應該在指定的時間內停止,停止的位置仍然是紅色。
a.動畫效果在指定的時間內停止,實際上就是停止上述方法。在js中使用不同的方法,有不同的實現形式
5.當停止在某個位置以后,彈出一個對話框,顯示誰是被選中的同學。
a.Alert函數彈出最終的結果就ok了
在下一節中,將對這個小應用進行javascript代碼的實現哦。
聲明:本網頁內容旨在傳播知識,若有侵權等問題請及時與本網聯系,我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com
JavaScript實現班級隨機點名小應用需求的具體分析_javascript技巧
JavaScript實現班級隨機點名小應用需求的具體分析_javascript技巧:需求如下: 1.在網頁中顯示,班級所有人員的名字。 2.點擊開始按鈕,人員的顏色開始變化,當停止的時候,會有一個顏色不同的位置,那么這個位置就是被點到的同學了。 大致的圖形界面如下: 下面是對上面的需求分析的具體分析如下: 1.初始化這樣一個頁面,并