Review Algorithmic Thinking by Building a Dice Game - Step 1

JavaScript
1

Tell us what’s happening:

Task is to set up game framework and program rules and scorekeeping.What is wrong?

Your code so far

<!-- file: index.html -->


/* file: styles.css */


/* file: script.js */
// User Editable Region

 const listOfAllDice=document.querySelectorAll(".die");
 const scoreInputs=document.getElementById("three-of-a-kind","four-of-a-kind","full-house","small-straight","large-straight","none-of-the-above");
 const scoreSpans=document.querySelector("current-round-rolls","current-round",`label[for="three-of-a-kind"]`,`label[for="four-of-a-kind"]`,`label[for="full-house"]`,`label[for="small-straight"]`,`label[for="large-straight"]`,`label["none-of-the-above"]`);
 const roundElement=document.getElementById("current-round");
 const rollsElement=document.getElementById("current-round-rolls");
 const totalScoreElement=document.getElementById("total-score");
 const scoreHistory=document.getElementById("score-history");
 
 const rollDiceBtn=document.getElementById("roll-dice-btn");
 const rulesBtn=document.getElementById("#rules-btn");
 const rulesContainer=document.getElementById(".rules-container");
 const isModelShowing=false;
 const diceValuesArr=[];
 
 const rolls=document.getElementById("roll-dice-btn").addEventListener("click",(rolls)=>{rolls=0; rolls.value+1});
 const score=document.querySelector("total-score");
 const round=document.getElementById("roll-dice-btn").addEventListener("click",(rolls)=>{ rolls=1; rolls.value + 1});
 
 


// User Editable Region

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/142.0.0.0 Safari/537.36 Edg/142.0.0.0

Challenge Information:

Review Algorithmic Thinking by Building a Dice Game - Step 1

2

is your implementation addresses given testcases? such as:

2. You should assign your #score-options input elements to scoreInputs.

happy coding :slight_smile:

3

querySelector takes ine single string as argument

same for getElementById

are you sure you are doing that?

also they each select one element only

what’s the method that allows to select multiple elements?

if you are having issues review the DOM lessons: https://www.freecodecamp.org/learn/javascript-v9/#lecture-working-with-the-dom-click-events-and-web-apis

4

Update:still not working:

 let listOfAllDice=document.querySelectorAll(".die");
 let scoreInputs=document. querySelector("#score-options input");
 let scoreSpans=document.querySelector("#score-options span");
 let roundElement=document.getElementById("current-round");
 let rollsElement=document.getElementById("current-round-rolls");
 let totalScoreElement=document.getElementById("total-score");
 let scoreHistory=document.getElementById("score-history");
 let keepScoreBtn=document.getElementById("keep-score-btn")
 let rollDiceBtn=document.getElementById("roll-dice-btn");
 let rulesBtn=document.getElementById("#rules-btn");
 let rulesContainer=document.getElementById(".rules-container");
 let isModelShowing=false;
 let diceValuesArr=[];
 
 let rolls=0;
 let score=0;
 let round=1;
 
 
```