При нажатии кнопки "Открыть магазин" появляется промт с вопросом "Ваш бюджет?". При вводе данные должны отобразиться в строке "Бюджет магазина:" , но когда я ввожу цифры выдает ошибку - Cannot set property 'textContent' of undefined at HTMLButtonElement.open.addEventListener . В чем проблема?
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Java Script</title>
</head>
<body>
<div class="open">
<button class="open-btn" id="open-btn">Открыть магазин</button>
</div>
<div class="main">
<div class="main-info">
<div class="name">Название магазина: </div>
<div class="name-value"></div>
<div class="budget">Бюджет магазина: </div>
<div class="budget-value"></div>
<div class="goods">Категории товаров: </div>
<div class="goods-value"></div>
<div class="items">Наименования товаров: </div>
<div class="items-value"></div>
<div class="employers">Сотрудники: </div>
<div class="employers-value"></div>
<div class="discount">Дисконтная система </div>
<div class="discount-value"></div>
<div class="isopen">Открыто </div>
<div class="isopen-value"></div>
</div>
<div class="main-functions">
<div class="choose-goods">Введите категории товаров</div>
<input class="goods-item" type="text" id="goods_1">
<input class="goods-item" type="text" id="goods_2">
<input class="goods-item" type="text" id="goods_3">
<input class="goods-item" type="text" id="goods_4">
<button class="goods-item-btn">Утвердить</button>
<div class="choose-items">Введите продукты через запятую</div>
<input class="choose-item" type="text" id="items">
<div class="time">Сколько сейчас времени?</div>
<input class="time-value" type="text" id="time">
<div class="count-budget">Расчет дневного бюджета</div>
<input class="count-budget-value" type="text" id="budget">
<button class="count-budget-btn">Рассчитать</button>
<div class="hire-employers">Имена сотрудников</div>
<input class="hire-employers-item" type="text" id="employers_1">
<input class="hire-employers-item" type="text" id="employers_2">
<input class="hire-employers-item" type="text" id="employers_3">
<button class="hire-employers-btn">Нанять</button>
</div>
</div>
<link rel="stylesheet" href="css/style.css">
</body>
<script src="script.js"> </script>
</html>
let open = document.getElementById('open-btn'),
name_value = document.getElementsByClassName('name-value')[0],
budget_value = document.getElementsByClassName('budget_value')[0],
goods_value = document.getElementsByClassName('goods_value')[0],
items_value = document.getElementsByClassName('items_value')[0],
employers_value = document.getElementsByClassName('employers_value')[0],
discount_value = document.getElementsByClassName('discount_value')[0],
isopen_value = document.getElementsByClassName('isopen_value')[0],
goods_item = document.getElementsByClassName('goods_item'),
goods_btn = document.getElementsByTagName('button')[1],
budget_btn = document.getElementsByTagName('button')[2],
employers_btn = document.getElementsByTagName('button')[3],
choose_item = document.querySelector('choose-item'),
time_value = document.querySelector('time_value'),
count_budget_value = document.querySelector('.count_budget_value'),
hire_employers_item = document.querySelector('.hire_employers_item');
let money,
price;
open.addEventListener('click', () => {
money = prompt("Ваш бюджет?", "");
while(isNaN(money) || money == '' || money == null) {
money = prompt("Ваш бюджет?", "");
}
budget_value.textContent = money;
name_value.textContent = prompt('Название вашего магазина', "").toUpperCase();
});