Локальное сохранение переменной

есть код

<button onclick="plusScore()">Добавить очки</button>
	<button onclick="balanceUser()"> баланс </button>
		<!--scripts-->
		<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
		<script>

		var score = 0

         function plusScore() {
         	score = score + 100
         	alert('Очки пополнены!')
         }

         function balanceUser() {
         	alert('Твой баланс ' + score)
         }
		</script>

как сделать так, чтобы значение переменной score сохранилось после закрытия браузера, и после его открытия показался тот же баланс, который сохранился?


Ответы (1 шт):

Автор решения: Denis640Kb

Используйте localstorage или session или cookie для сохранения переменной в зависимости от потребностей.
Так же Вам стоит убрать var score = 0 чтобы прибавлять данные к сохранённому значению.
Пример с комментариями:

<button onclick="plusScore()">Добавить очки</button>
<button onclick="balanceUser()"> баланс </button>
<!--scripts-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>

    function plusScore() {
        var score = localStorage.getItem('Score'); //Получаем значение из переменной, если её нет - будет null
        score = +score + 100; // Значение score приводим к числу и к этому значению прибавляем 100
        console.log(score);
        localStorage.setItem('Score', score); //Сохраняем в localstorage
    }

    function balanceUser() {
        var scor = localStorage.getItem('Score'); //Получаем значение из localstorage
        console.log(scor);
    }
</script>
→ Ссылка