Как отформатировать данные из localstorage?

272
06 марта 2018, 02:44

Имею в localstorage данные в таком виде:

{"SCI-3":{"quantity":5,"id":"SCI-3","price":4000,"name":"Проба","thumb":"photo.png","size":"80×80","link":"proba.html"},"SCI-4":{"quantity":1,"id":"SCI-4","name":"Проба","thumb":"photo.png","size":"20×20","link":"proba.html"}}

SCI может быть много с разными номерами. Я вытянул из localstorage выше написанные данные для того чтобы использовать как значение в textarea.

Вопрос: Можно данные перед вставкой в textarea привести к такому виду? Ну и как это сделать?

<textarea>
№: SCI-3
Название: Проба
Ссылка: proba.html
Фото: photo.png
Размер: 80×80
Количество: 5
Сумма: 4000
№: SCI-4
Название: Проба
Ссылка: proba.html
Фото: photo.png
Размер: 20×20
Количество: 1
Сумма: 
</textarea>
Answer 1

Собственно пробегаемся и выводим, то, что нужно.

var data = {"SCI-3":{"quantity":5,"id":"SCI-3","price":4000,"name":"Проба","thumb":"photo.png","size":"80×80","link":"proba.html"},"SCI-4":{"quantity":1,"id":"SCI-4","name":"Проба","thumb":"photo.png","size":"20×20","link":"proba.html"}}; 
 
var text = ''; 
 
for(element in data){ 
 
  text += "№ "+element+"\r\n"; 
  text += "Название: "+data[element]['name']+"\r\n"; 
  text += "Ссылка: "+data[element]['link']+"\r\n"; 
  text += "Фото: "+data[element]['thumb']+"\r\n"; 
  text += "Размер: "+data[element]['size']+"\r\n"; 
  text += "Количество: "+data[element]['quantity']+"\r\n"; 
  text += "Сумма:\r\n\r\n"; 
} 
 
document.querySelector('textarea').value = text;
textarea { 
  height: 250px; 
  width: 300px; 
}
<textarea></textarea>

READ ALSO
куки или локальное хранилище

куки или локальное хранилище

Подскажите пожалуйста где лучше хранить информацию? Где быстрее? Где безопасней?

284
Скачивание файла, после отправки формы (wordpress)

Скачивание файла, после отправки формы (wordpress)

У меня есть страница с документами(pdf, doc) на сайте, хотелось бы знать кто скачивал, чтобы перед скачиванием заполнили данные и никак не скачивалось...

223
Настройки CSS для подсветки пустых div (разметка сеток)

Настройки CSS для подсветки пустых div (разметка сеток)

Всем приветНашел видео по разметке сеток сайтов в котором используется css для подсветки названий и границ блоков, использованных в вёрстке...

243
Bootstrap, как при Collapse сделать другое меню?

Bootstrap, как при Collapse сделать другое меню?

Доброго времени суток! Существует следующий вопрос по BootstrapПредположим есть вот такое меню

232