HTML5 localStorage(XML / JSON数据)

时间:2011-11-27 07:15:26

标签: javascript jquery xml json html5

我有一个XML文件,如下所示:

<itemnumbers>
<item>
<itemno>123</itemno>
<desc>Desc about 123</desc>
</item>

<item>
<itemno>456</itemno>
<desc/>
</item>

...

</itemnumbers>

我想使用HTML5 localStorage存储数据(并检索以便更快地访问),因为XML数据不会定期更改。

我计划先将其转换为JSON,然后将其存储在localStorage中。我应该在代码中执行此操作,还是先将数据放在.JSON文件而不是.xml文件中?

如何在以后解析数据? 目前我正在使用jQuery代码来解析...类似于:

$(this).find("itemno").each(function()
{
$(this).text();
$(this).next().text()
}

上述代码在JSON转换后是否有效?

我想就最佳方法提出建议。

2 个答案:

答案 0 :(得分:1)

我同意您可以继续使用XML的一些评论。如果你想转换为JSON,你可以在javascript中使用For In循环来循环遍历它,就像你在javascript中的对象一样。

您在JSON中的数据:

{"itemnumbers": 
    { "item": {"itemno": 123, "desc": "Desc about 123"} }
    { "item": {"itemno": 456, "desc": "Desc about 456"} }
}

循环访问数据,其中数据是上面的JSON对象:

for (item in data.itemnumbers) {
    //do something with item data
    console.log(data.itemnumbers[item].itemno);
    console.log(data.itemnumbers[item].desc);
}

要在localStorage中保存对象,必须将其转换为可以作为对象再次取回的字符串格式。您可以使用JSON.stringify()将对象设为字符串,使用JSON.parse()将其拉回:

//saving object to localStorage
localStorage['my_data'] = JSON.stringify(data);

//fetching object from localStorage
data = JSON.parse(localStorage['my_data']);

请注意,因为IE7及更低版本不支持这些方法,因此您需要找到与它们兼容的解析库。这是一篇可能有助于兼容性的帖子:

Safely turning a JSON string into an object

答案 1 :(得分:0)

我建议你编写一个脚本,将XML数据转换为JSON,然后将其发送到客户端并保存。

稍后在需要时解析JSON,这很容易做到。如下所示: -

var jsonObject = JSON.parse(yourObjectInJSON);

循环使用: -

for (item in jsonObject.itemnumbers) {
//do something with item data
}