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

326
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
куки или локальное хранилище

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

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

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

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

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

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

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

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

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

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

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

295