将 HTML 转换为 JSON 时出现问题答案

【问题标题】：Issue while converting HTML to JSON将 HTML 转换为 JSON 时出现问题
【发布时间】：2010-12-29 19:11:43
【问题描述】：

我有一个包含以下内容的 div：

<div id="hidLocsJsonForAutoComplete" style="display:none;">[{"id":1,"desc":"Amazon","name":"amazon"},{"id":2,"desc":"Apple Bees","name":"applebees"},{"id":3,"desc":"Babys r Us","name":"babysrus"},{"id":4,"desc":"Costco","name":"costco"},{"id":5,"desc":"Concord Produce","name":"concordproduce"},{"id":6,"desc":"Grocery Outlet","name":"groceryoutlet"},{"id":7,"desc":"New India Bazar","name":"newindiabazar"},{"id":8,"desc":"SubWay","name":"subway"},{"id":9,"desc":"Walmart","name":"walmart"}]</div>

然后在脚本部分我有这个

var jsonLocs = $('#hidLocsJsonForAutoComplete').html();

现在，jsonLocs[0] 正在返回

而不是

{"id":1,"desc":"Amazon","name":"amazon"}

我了解 jsonLocs 被视为字符串。但是如何获取这个数组中的第一个 Json 对象呢？

【问题讨论】：

标签： jquery html json

【解决方案1】：

jsonLocs 包含一个 String 对象，您需要将内部 HTML 解析为 json。试试这个：

var jsonLocs = $.parseJSON($('#hidLocsJsonForAutoComplete').html());

【讨论】：

【解决方案2】：

如果您使用的是 jQuery 1.4.1 或更新版本，您可以使用 jQuery 内置的.parseJSON() 函数：

var jsonLocs = $.parseJSON($('#hidLocsJsonForAutoComplete').html());

在旧版本上，您可以只使用 eval （如果做错了，可能会使自己面临潜在的安全/等问题，但是..）：

var jsonLocs = eval('('+$('#hidLocsJsonForAutoComplete').html()+')');

【讨论】：

【解决方案3】：

没关系，得到答案！ :)

var jsonLocs = eval($('#hidLocsJsonForAutoComplete').html());

施了魔法。但想知道这是否是最有效/推荐的方法。

【讨论】：

【解决方案4】：

变量jsonLocs 只是一个字符串，这就是为什么当你索引第一个元素时，你会得到字符串的第一个字符。你需要做的是将parse的HTML值转换成一个Javascript对象，然后取第一个元素。

因此，您将需要执行以下操作：

var jsonLocs = JSON.parse($('#hidLocsJsonForAutoComplete').html());

当然，对于不支持原生 JSON 解析的浏览器，你可以使用 Douglas Crockford 的wonderful library（如果你喜欢危险的生活，也可以使用eval）。

【讨论】：