输出JSON键，JavaScript中的值

I have a json file with content in this format:

我有一个json文件，其内容采用以下格式：

{
  "Florida":{
   "4079823456" : "Text message content 1 here",
   "4079323457" : "Text message content 2 here",
   "4079823458" : "Text message content 3 here"
},

"Texas":{
   "2149823456" : "Text message content 1 here",
   "2149323457" : "Text message content 2 here",
   "2149823458" : "Text message content 3 here"
}

}

I am using javascript (no libraries) to output the key/value pairs in the json file to an html table to get an output like this:

我使用javascript（没有库）将json文件中的键/值对输出到html表以获得如下输出：

Phone Number | Text Message
4079823456   | Text message content 1 here
4079323457   | Text message content 2 here

But instead, I get something like this:

但相反，我得到这样的东西：

  Phone Number | Text Message
      0            {
      1            "

The following is a code snippet from my javascript:

以下是我的javascript代码片段：

var str = JSON.stringify(http_request.responseText);
var obj = JSON.parse(str);
var rowContent;

var tablerows = document.getElementById("tablerow");

for(var key in obj){
   rowContent = "<tr><td>" + key + "</td><td>" + obj[key] + "</td></tr>";

   tablerows.innerHTML += rowContent;
}

How can I get the key value pairs to output to the desired output instead of getting each individual character in my JSON file? Ideally, I would like to loop through both the key and the value (in my case, the phone numbers and text messages) as there are actually hundreds of them.

如何将键值对输出到所需的输出而不是获取JSON文件中的每个单独字符？理想情况下，我想遍历密钥和值（在我的情况下，电话号码和短信），因为实际上有数百个。

Thanks in advance.

提前致谢。

2 个解决方案

#1

For your data you can use two for...in loops and add to table. Also its better to create string with table content and add it after loop is finished.

对于您的数据，您可以使用两个for ... in循环并添加到表中。最好用表格内容创建字符串，并在循环结束后添加它。

var data = {
  "Florida": {
    "4079823456": "Text message content 1 here",
    "4079323457": "Text message content 2 here",
    "4079823458": "Text message content 3 here"
  },
  "Texas": {
    "2149823456": "Text message content 1 here",
    "2149323457": "Text message content 2 here",
    "2149823458": "Text message content 3 here"
  }
}

var table = document.querySelector('table');
var rows = '';
for (var p in data) {
  for (var k in data[p]) {
    rows += '<tr><td>' + k + '</td><td>' + data[p][k] + '</td></tr>'
  }
}
table.innerHTML = rows;

<table></table>

#2

You don't need to call JSON.stringify(), your response is already a JSON string.

您不需要调用JSON.stringify（），您的响应已经是一个JSON字符串。

Instead, do the following:

相反，请执行以下操作：

var obj = JSON.parse(http_request.responseText);

#1