json解析

Question

这是我的代码，我通过在for循环中克隆数据来将数据填充到模板中。

$('.menu li').on('click', function() {

        var templateName = $('.template-list');

        var template = [];
        var data = [];

        for(var i = 0; i < 9; i++) {

             template = $(templateName).removeClass('hidden').clone();

             $(template).find('[data-image] img').attr('src', 'http://via.placeholder.com/350x200');
             $(template).find('[data-type]').html('cosmetic product');
             $(template).find('[data-price]').html('$30');
             $(template).find('[data-title]').html('Beauty cafe');
             $(template).find('[data-desc]').html('stry. Lorem Ipsum has been the industry\'s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetti');

            data.push(template);

        }

        $('#list').append(data);//this works correctly, I don't want to append on the same page.

    });

上面的代码工作，因为它被克隆模板，被推送到名为data的数组，并将结果附加到ID #list的同一页面div。

但我打算做的是将结果附加到另一页上。

要保留跨页面的值，我使用sessionStorage。 所以，

sessionStorage.setItem('result', JSON.stringify(data));
location.replace('redirect to another page here);

在另一页上，

var data2 = JSON.parse（sessionStorage.getItem（＆＃39; result＆＃39;））; //我确实把解析后的字符串放回到对象数组中，但数据似乎没有保留。

//下面抛出错误说，数据不在上下文中

for (var i = 0; i< total; i++) {
    console.debug(data[i]);
    $('#list').append(data[i]);
}

我这样调试：

 1)  console.debug(data);
    sessionStorage.setItem('result', JSON.stringify(data));

1）的结果是：

 2) var data2 = JSON.parse(sessionStorage.getItem('result'));
    console.debug(data2);

2）的结果是：

结果显示当我在json.parse之前和之后单击任何数组对象时结果包含的内容。