چگونه با جاوا اسکریپت بازی حدس عدد بسازیم؟

اولین تصویرخوب عکس بالا شکل بازی ماستوقتی حدس غلط می زنیم شکل بالا رو داریمو وقتی هم درست حدس می زنیم این شکل رو داریم و امتیازات هم چه مثبت و چه منفی که بر اساس حدس درست و غلط داده میشه ثپت میشهhtml <div class=&quotconteaner&quot> <h1>GUESS NUMBER</h1> <label>Tell me your number, between 1 to 9</label> <br> <div class=&quotsubcon&quot> <span id=&quotnegetive&quot>-</span> <input type=&quottext&quot id=&quotmynumber&quot placeholder=&quotenter your number&quot> <span id=&quotpositive&quot>+</span> <br> </div> <div class=&quotseocnsubcon&quot> <h3>click me to check your guess</h3> <br> <button id=&quotsubmit&quot>click</button> <button id=&quotretry&quot>↻</button> </div> </div> <div id=&quottextcompar&quot style=&quottext-align:center;&quot> </div> css .conteaner{ margin-left: auto; margin-right: auto; text-align: center; display: flex; flex-direction: column; flex-wrap: wrap; justify-content: flex-end; align-items: center; } h1{ background-color: black; color: antiquewhite; } label{ background-color: rgb(200, 215, 33); line-height: 41px; font-size: 27px; box-shadow: 0px 2px 3px; } span{ color: rgb(0, 0, 0); } #negetive{ background-color: red; padding: 23px; border-radius: 50%; } #positive{ background-color: green; padding: 23px; border-radius: 50%; } button{ padding: 15px; background-color: black; border-radius: 31%; box-shadow: 1px 1px 3px; color: wheat; } input{ padding: 23px; text-align: center; font-size: larger; } .subcon,.seocnsubcon{ margin-top: 12px; } #textcompar{ font-size: 23px; margin: 20px; } #numone{ background-color: aqua; padding: 16px; border-bottom: 7px solid red; border-radius: 36%; } #numonesecond{ background-color: rgb(242, 255, 0); padding: 16px; border-bottom: 7px solid red; border-radius: 36%; } #rote{ background-color: aqua; padding: 16px; border-bottom: 7px solid red; border-radius: 36%; } #retry{ background-color: black; color: balack; font-size: 21px; border-radius: 50%; }js const submit=document.getElementById(&quotsubmit&quot) let negetive_scover=1 let posiotive_scover=1 submit.addEventListener(&quotclick&quot,e=>{ const generatnumber=Math.floor(Math.random()*10) const mynumber=document.getElementById(&quotmynumber&quot).value const error=document.getElementById(&quotmynumber&quot) error.value=&quot&quot if( negetive_scover>7){ alert(&quotyou lose&quot) } if(mynumber>=0 && mynumber<=9){ if(generatnumber==mynumber){ document.getElementById(&quottextcompar&quot)=` your number is <span id=&quotrote&quot>${mynumber}</span> and mine is <span id=&quotrote&quot> ${generatnumber} :)<span>` const positive=document.getElementById(&quotpositive&quot) positive=posiotive_scover return posiotive_scover=posiotive_scover+1 console.log(mynumber); }else if(generatnumber!=mynumber){ document.getElementById(&quottextcompar&quot)=` your number is <span id=&quotnumone&quot>${mynumber}</span> and mine is <span id=&quotnumonesecond&quot> ${generatnumber}:(</span>` const negetive=document.getElementById(&quotnegetive&quot) negetive=negetive_scover return negetive_scover=negetive_scover+1 } }else{ alert(&quotplease enter number between 1 to 9&quot) } const retry=document.getElementById(&quotretry&quot) retry.addEventListener(&quotclick&quot,e=>{ const positive=document.getElementById(&quotpositive&quot) const negetive=document.getElementById(&quotnegetive&quot) const textcompar=document.getElementById(&quottextcompar&quot) positive=&quot+&quot negetive=&quot-&quot textcompar=&quot&quot})لینک دانلود فایل کد ها https://github.com/mamadhasn/GUESS-NUMBER-game-with-javascript