This has been boggling my brain for a few days and no matter how much I research or look at docs it doesn't seem to be easy to resolve as it seems.
I have written a website that is a quiz with 30 questions, I have separated each page to have 5 questions on each HTML page.
I also have an external JS sheet that works with the HTML when it is all on one page however, if I am to make it look neater and keep my 5 questions on each page I need to carry the variable across. At the moment when I click on "next page" that variable is reset back to 0 instead of remembering the score of the previous page.
I would like to be able to call the "score" from the previous page and continue on each subsequent page
Ideally I would also have a way to show the current score on the HTML page as a running total.
I am brand new to the concept of local storage and have only been working on coding for a relatively short time. All the answers I have found online have not been in language I have really understood and though I have tried to replicate the correct outcome I have not been successful, and so I come here to ask you wonderful people how on earth I can do this without breaking my brain?
I had considered trying to define the variable with global scope but all it suggested I do was change let to var and that didn't seem to work either.
Here is a snippet of code with my score variable and the function updating it.
let score = 0;
// ==========================QUESTION 1=============================================
function check1(){
let cAns1 = 'Eurythmics';
let input = document.getElementById("q1").value;
if(input.toLowerCase() == cAns1 ) {
alert("That is correct")
score++
alert("You have a total of " + score + " points")
}else{
alert("Incorrect.")
};
};```
Many thanks for your input everyone
