HTML код в local storage

Задача: есть кинозал с возможностью выбирать места, по клику на место у него меняется класс на seat--selected. Нужно сохранять выбранные места в local storage чтобы после перезагрузки страницы места "оставались выбранными".

<section class="hall">
    <div class="seats-row">
      <div class="seat"></div>
      <div class="seat"></div>
      <div class="seat"></div>
      <div class="seat"></div>
      <div class="seat seat--selected"></div>
      <div class="seat"></div>
      <div class="seat seat--selected"></div>
      <div class="seat"></div>
    </div>
</section>

Методом тыка пришел к варианту записывать в local storage верстку кинозала при каждом обновлении выбора мест, а после обновления страницы записывать верстку из local storage через innerHTML.

    const $hall = document.querySelector('.hall');
    function onSeatClick(e) {
    //тут код смены класса
    localStorage.setItem("hall", JSON.stringify($hall.innerHTML));
    }

Собственно вопрос: насколько корректно записывать в local storage HTML? Если не очень, то какие еще есть варианты решения задачи?


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