Как вывести данные JSON в аттрибут data-*

Юлия
Юлия
699
3
Есть загнанные в локальное хранилище данные (таблица): 

$(function() {
  $('#but2').click(function() {
    var jsonArr = [];
    var obj = {};
    var thNum = document.getElementsByTagName('th').length;
    var arrLength = document.getElementsByTagName('td').length;
    for (i = 0; i < arrLength; i++) {
      if (i % thNum === 0) {
        obj = {};
      }
      var head = document.getElementsByTagName('th')[i % thNum].innerHTML;
      var content = document.getElementsByTagName('td')[i].innerHTML;
      obj[head] = content;
      if (i % thNum === 0) {
        jsonArr.push(obj);
      }
    }
    document.write("<br>" + JSON.stringify(jsonArr));
    localStorage.setItem('myStorage', JSON.stringify(jsonArr));
  });
});
Нужно вывести данные из хранилища в аттрибут data-name: 

<button class="good-item__btn-add btn btn-info btn-sm js-add-to-cart"
    data-id="11"
    data-name="сюда вывести данные"
    data-price="1500">
    Добавить в корзину
</button>
Возможно ли это, подскажите куда копать???

Комментарии: 3

Александр Мальцев
Александр Мальцев
12.08.2018, 05:05
Получение данных из localStorage осуществляется с помощью метода getItem:
var data = localStorage.getItem('myStorage');
Вставить данные в атрибут элемента, осуществляется на jQuery с помощью метода attr.
$(selector).attr('data-name',data);
Юлия
Юлия
12.08.2018, 13:41
Спасибо!
После вывода данных получаю ответ:
[{«Название города»:"\t\t\n\t ",«Своя надпись»:"\t\t\n\t ",«Шрифт»:"Lobster",«Размер шрифта»:"Крупный",«Ориентация»:"Книжная"}]

Возможно ли вернуть данные в виде таблицы, или представить в удобночитаемом виде, без скобок, кавычек, дивов?
Александр Мальцев
Александр Мальцев
13.08.2018, 16:04
Для этого необходимо разобрать строку с помощью JSON.parse
var dataObj = JSON.parse(data);
После этого можно перебрать свойства и представить их, так как нужно:
for (var prop in dataObj) {
  console.log('Свойство ' + prop + ' имеет значение: ' + dataObj[prop]);
}