Как вывести на div сохранённый в local.Storage элемент

хочу спросить, как вывести элемент с local.Storage на div. У меня есть код, который я напишу ниже, в котором есть функция ввода(цифры-числа) в localStorage, как мне потом вывести данное число на div, и как проводить с ним для примера сложение, допустим я ввёл число 46, что должно сохранится даже после перезагрузки страницы в localStorage, так же у меня есть некий x что равен 15, и как мне произвести сложение, что бы после перезагрузки страницы было не число 46, а уже 61 Код js,html:

const Display = document.getElementById("disp1");
let x = 11;

function cIn() {
    r = "Введите желаемое число";
    window.localStorage.setItem('z', window.prompt(r));
  }
function Chislo() {
   Display.innerText = window.localStorage.getItem('z');
  }
  function xPlus() {
    balanceDisplay.innerText + x;
  }
<div id="disp1">0.00</div>
<div id="button" onclick="xPlus()"></div>

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

Автор решения: Tytenok
<div id="disp1">0.00</div>
<button onclick="cIn()">Ввести число</button>
<button onclick="xPlus()">Сложить с x</button>

<script>
const Display = document.getElementById("disp1");
let x = 11;

function cIn() {
    const number = window.prompt("Введите желаемое число");
    window.localStorage.setItem('z', number);
}

function Chislo() {
    const savedNumber = window.localStorage.getItem('z');
    Display.innerText = savedNumber || "0.00"; // Если число не сохранено, выводим "0.00"
}

function xPlus() {
    const savedNumber = window.localStorage.getItem('z');
    if (savedNumber) {
        const result = parseInt(savedNumber) + x;
        window.localStorage.setItem('z', result);
        Chislo(); // Обновляем вывод числа на элемент div
    }
}

// Вызываем функцию Chislo() при загрузке страницы, чтобы вывести сохраненное число
Chislo();
</script>
→ Ссылка