如何在多个 html 页面上声明变量

Question

I am making a quiz with a lifes system and the lifes system works but i wanna make it so for example, if you lose a life on q1 you will have 2/3 lives, but when you go onto question 2 you would still have 2/3 lives. I do not know how to do this.. Any help would be appreciated as i am a new javascripterer:D

js so far: (the lives code)

var lives = 3;
var loadLives = setInterval(showLives, 100);

function loseLife() {
    if (lives > 1) {
        lives = --lives;
    }
    else {
        location.href='fail.html';
    }
}

function showLives() {
    document.getElementById("lifeamount").innerHTML = lives;
}

Answer 1

Try to use local storage like this:

// get lives from localstorage
var livesInStorage = window.localstorage.getItem('lives');
let lives;

if(livesInstorage) {
  //parse localstorage data to Int
  lives = parseInt(livesInstorage, 10);
}
else {
  // initial value (in this case: 3)
  lives = 3;
}

function loseLife() {
    if (lives > 1) {
        lives = --lives;

        // set changed value in localStorage
        window.localstorage.setItem('lives',lives);
    }
    else {
        location.href='fail.html';
    }
}