json字符串怎么变成树形结构

JSON字符串是现代软件开发中非常重要的一种数据格式，它简单明了，易于阅读和传输。但在某些情况下，我们需要将JSON数据转换成树形结构，以更好地展示数据，提高易读性和可理解性。

下面我们来看一下如何将JSON字符串转换成树形结构。

// 假设我们有以下一段JSON数据
var jsonStr = '{"name":"Jack","age":26,"hobbies":["reading","traveling"],"friends":[{"name":"Mary","age":24},{"name":"Alex","age":28}]}';

// 首先，我们需要将JSON字符串解析成JavaScript对象
var jsonObj = JSON.parse(jsonStr);

// 然后，我们可以使用递归函数将JSON对象转换成树形结构

function jsonToTree(jsonData) {
  var result = '';

  for (var key in jsonData) {
    if (jsonData.hasOwnProperty(key)) {
      var value = jsonData[key];

      if (typeof value === 'object') {
        result += '<li>' + key + '：<ul>' + jsonToTree(value) + '</ul></li>';
      } else {
        result += '<li>' + key + '：' + value + '</li>';
      }
    }
  }

  return '<ul>' + result + '</ul>';
}

// 调用函数，将JSON对象转换成树形结构
var tree = jsonToTree(jsonObj);

// 最后，我们可以将树形结构渲染到网页上
document.getElementById('tree-view').innerHTML = tree;

如上所示，我们首先需要将JSON字符串解析成JavaScript对象，然后使用递归函数将其转换成树形结构。递归函数内部判断数据类型，如果是对象，则用 ul、li 标签将其包裹起来，再次调用函数实现嵌套；如果是基本数据类型，则只需使用 li 标签进行包裹即可。

最后，我们可以将树形结构渲染到网页上，展示给用户。