Как заменить теги при использовании clone()?

DanKud, на jquery нужно что-то типа такого ?

let cart = [];

			function Item(id, p) {
				this.id = id;
				this.p = p;
			}

			function saveCart() {
				localStorage.setItem("shoppingCart", JSON.stringify(cart));
			}

			function loadCart() {
				cart = JSON.parse(localStorage.getItem("shoppingCart"));
				if (cart === null) {
					cart = []
				}
			}

			loadCart();

var item = new Item(id, p);
				cart.push(item);
				saveCart();
			};

    $('body').on('change', '.check', function(){
    var modal = $('.modal');

    if ($('input').is(':checked')) {
        if (!modal.children().is('.item')) modal.html('');
    } else {
        modal.removeClass('modal-show').text('Здесь ничего нет');
    }
    
    if ($(this).prop('checked')) {
        modal.addClass('modal-show');
     }

     var id= $(this).attr("id");
     var p = $(this).parent().siblings('.copy, .copy-2');
    
});

Как добавить произвольные ключи в объект localStorage?

Роман, т.е. получается в localStorage все таки придется хранить html, если будет вложенность ?

Как добавить произвольные ключи в объект localStorage?

Роман, у параграфов классы, причем можно же разные использовать ?

Еще такой вопрос, а если допустим у меня будет вложенность ?

Пример:

<h4>Название</h4>
<p class="copy"><a href="#">1</a></p>
<p class="copy-2"><b>1.1</b></p>

Как добавить произвольные ключи в объект localStorage?

Роман, заранее спасибо за ответ и оказанную помощь !

Я абстрагировался изначально от данного примера:

https://codepen.io/antonietta/pen/MVedpj

Мне просто нужен похожий пример, но только на чекбоксах

Искал примеры,- но так и не нашел (

сделал list массивом. Непонятно только как вы при таком подходе собираетесь сопоставлять чекбоксы нужным индексам. я уже спрашивал вас о логике их выбора:

Логика такая - при нажатии на чекбокс, мне нужно заносить в localStorage id чекбокса и параграфов, которые находятся непосредственно после чекбокса

А в модальном окне выводить точно также, как и в верстке

Т.е. в модальном окне я хотел видеть верстку вот так:

<div class="item">
<p class="copy">1</p>
<p class="copy-2">1.1</p>
</div>

<div class="item">
<p class="copy">2</p>
<p class="copy-2">2.1</p>
</div>

P.S. Я же смогу допустим сохранять картинку в localStorage ?

Если у меня будет вот такой пример:

<div>
  <p><input class="check" id="check-option-1" name="name" type="checkbox">
  <label for="check-option-1"></label>
  </p>
  <img src="путь к картинке" alt="">
  <h4>Название</h4>
  <p class="copy">1</p>
  <p class="copy-2">1.1</p>
</div>

Получается мне нужно в объект добавить еще ключи и значения?

Как добавить произвольные ключи в объект localStorage?

Роман, заранее извиняюсь, я все прочитал )

Просто возможно у нас разные часовые полюса, поэтому я не успел Вам ответить, еще раз - извиняюсь заранее (

Может этот пример будет нагляднее ?

https://codepen.io/Genri_Rus/pen/PgKago

По данному примеру все Вы правильно показываете

Насчет параграфов, то я не знаю как поместить сразу в localStorage вот эти строчки:

В text должно быть: 1 1.1

<p class="copy">1</p>
<p class="copy-2">1.1</p>

В text должно быть: 2 2.1

<p class="copy">2</p>
<p class="copy-2">2.1</p>

Мне нужно в ключе p или как у вас: "text" хранить не отдельно, а сразу 2 значения (текста) в параграфах

Вот как в старом примере они хранились:

check-option-1: "1 1.1"
check-option-2: "2 2.1"

https://codepen.io/Genri_Rus/pen/zXawjm

Только нужно вот так:

0: {
 id: check-option-1,
 text: 1 1.1
},
1: {
 id: check-option-2,
 text: 2 2.1
}

Возможно такой вариант можно сделать только с помощью массива (я просто не знаю, как это можно сделать более правильно) ?

Как добавить произвольные ключи в объект localStorage?

Роман, спасибо за пример и разъяснения !

А вот как сделать именно так ?

Т.е. мне нужно исключительно в localStorage хранить только id чекбоксов и текст у параграфов ?

0: {
 id: id,
 p: текст параграфа
},
1: {
 id: id,
 p: текст параграфа
}
....
и.т.д

Как добавить произвольные ключи в объект localStorage?

check-option'ы - id

А параграфы (текст) - copy, copy-2
Или так сделать невозможно ?

Допустим весь текст должен храниться в ключе, под названием p

Как добавить произвольные ключи в объект localStorage?

Rsa97, у меня есть цикл, как можно в цикле добавить ключи к объекту ?

Как добавить произвольные ключи в объект localStorage?

Rsa97, мне нужно просто добавить ключи к объекту, json выводит объект

Вот примерно так: https://codepen.io/antonietta/pen/MVedpj

Как добавить дополнительные объекты в localStorage?

Stalker_RED, почему вы не хотите показать, как нужно сделать ?

Если вам это легко показать, то мне допустим непонятно, т.к. я новичок ...

list[elem.id], далее list[key] - JSON.parse(localStorage.getItem(localStorageKey)) || {}

В вашем примере переменная list является объектом, в каком месте добавить ключи, не совсем ясно

Как добавить дополнительные объекты в localStorage?

Stalker_RED, у Вас вот так:

check-option-1: "11.1"
check-option-2: "22.1"

А мне нужно вот так:

0: {
 id: id,
 p: текст параграфа
},

Как добавить дополнительные объекты в localStorage?

Stalker_RED, хотя бы покажите, как можно объектам ключи задать

Ключ у id чекбоксов начинается с 0, а мне нужно так:

0: {
 id: id,
 p: текст параграфа
},

Как добавить дополнительные объекты в localStorage?

Stalker_RED, ))

Это был пример, а вот как мне хотелось бы:

0: {id: "id",…}
id: "id"
p: "текст параграфа"
1: {id: "id",…}
id: "id"
p: "текст параграфа"

0: {
 id: id,
 p: текст параграфа
},
1: {
 id: id,
 p: текст параграфа
}
....
и.т.д

Как добавить дополнительные объекты в localStorage?

Stalker_RED, мне нужно что-то типа такого, но только с использованием чекбоксов:

https://codepen.io/antonietta/pen/MVedpj

А в вашем примере вот так:

{check-option-1: "11.1", check-option-2: "22.1"}
check-option-1: "11.1"
check-option-2: "22.1"

У id чекбоксов 0 ключ, а мне нужно что-то такого:

0: {id: "id",…}
id: "id"
p: "текст параграфа"
1: {id: "id",…}
id: "id"
p: "текст параграфа"

Получается вложенность:

0: {
 id: id,
 p: текст параграфа
},
1: {
 id: id,
 p: текст параграфа
}
....
и.т.д

Вот этот кусочек кода я так понял делает проверку на checked ?

if (Object.keys(list).length) {
    for (let key in list) {
      document.getElementById(key).checked = true
      modal.innerHTML += list[key]
    }
  }

  document.addEventListener('change', evt => {
    if (evt.target.matches(checkboxSelector)) {
      if (evt.target.checked) {
        addToList(evt.target)
      } else {
        delete list[evt.target.id]
      }
      updateModal(list)
      saveChanges(list)
    }
  })

Как добавить дополнительные объекты в localStorage?

Stalker_RED, мне нужно примерно вот так:

0: {id: "6",…}
id: "6"
image: "image"
name: "name"
price: "price"
1: {id: "7",…}
id: "7"
image: image"
name: "name"
price: "price"

А в вашем примере вот так:

{check-option-1: "11.1", check-option-2: "22.1"}
check-option-1: "11.1"
check-option-2: "22.1"

У id чекбоксов 0 ключ, а мне нужно что-то такого:

0: {id: "id",…}
id: "id"
p: "текст параграфа"
1: {id: "id",…}
id: "id"
p: "текст параграфа"

Получается вложенность:

0: {
 id: id,
 p: текст параграфа
},
1: {
 id: id,
 p: текст параграфа
}
....
и.т.д

Как добавить дополнительные объекты в localStorage?

Stalker_RED, да вот сижу пытаюсь )

Вот пример смотрел: https://codepen.io/Asmodey/pen/oXbXjr

Правда я не могу понять, в какую строку добавить ключи и с присвоением textContent у меня в модальном окне теги p пропали

Как заменить теги при использовании clone()?

DanKud, вот еще пример: https://codepen.io/Fullzero/pen/QMNbBm

Он на jquery, такой пример тоже подойдет ?

Как добавить дополнительные объекты в localStorage?

Stalker_RED, ну вы бы написали, как это правильно и грамотно сделать )

тут поможет только одно - если кто-то сделает всю работу за тебя

Я новичок, мне просто было интересно, как с помощью правильного алгоритма сделать на чекбоксах хранение данных

писать бредятины типа let if

Не заметил - понятное дело, что это брядятена - удалил let, я просто хотел спросить, вы же лучше знаете :)

Как добавить дополнительные объекты в localStorage?

Stalker_RED, ну я же спрашивал )

Примерно вот так ?

if (localStorageKey !== null ) {
    lsContent.push({
       id: id,
       p: paragraf
   });
}

Как добавить дополнительные объекты в localStorage?

Stalker_RED, а как сделать, чтобы это выглядело более красиво ?

Допустим, чтобы в localStorage хранились данные вот так:

id: id чекбокса
p: текст параграфа