本文主要是介绍項目:星星評分,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
Demo
任務描述:
1.滑鼠移過星星的顏色會跟著改變(評分),並且評價的內容文字依照星星級數跟著改變
2.滑鼠移開,所有東西取消
3點擊星星以後星星顏色固定並不會隨著滑鼠移開取消,並且顯示評價的內容
4.滑鼠再次移入時可以更換星星評價,只要沒有點擊再次移開滑鼠即回到點擊時的狀態
這次練習是透過大神分享的項目來練習的!!(點擊這裡)所有的代碼可以從以上的dem裡查看這次也是先自己敲完以後,實在有問題再來看一下大神是如何敲的,這次新學到很多東西特別是簡寫方面的用法!!
心得:
star = over || overStar;
整個部分最困難的地方是顯示星星的部分,要先能夠判斷星星是滑過的狀態?還是移出的狀態?或是已經被點擊過的狀態? 而 以上這句代碼很好的幫我們分辨了星星的狀態。
這句代碼的意思是如果over為真則start=over如果為非則start=overstar(我在這裡整理了更詳細的說明),先把over設定為了形參,並且在滑鼠移入時給予實參,但在滑鼠移出時並沒有給予參數,這樣一來,當滑鼠移入時start=over(over為真),則區分了是滑鼠移入還是移出的狀態。
在沒有型參的狀態下,start=overStart,此時再判斷是否是點擊狀態,也就是說在點擊的時候賦予overStart數值(點了幾個星星),如果沒有點擊則沒有數值(回到原本狀態)。
總結
這次學到的內容很龐大,並且需要重複複習,在此我另外寫了幾篇文章(match的用法,js各種簡寫)來更詳細的做紀錄!!以上,望能持之以恆!!
这篇关于項目:星星評分的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!