我如何將這個按標題分組的 json 展平，以便我可以以更易於理解的方式呈現這些數據？

Question

我知道，在 Javascript 中遍歷任意 json 數據有很多問題。 但是，我需要以更易於理解的方式呈現數據嗎？

編輯：json 將是任意的……嵌套對象、數組、字符串等的混合。我只需要將每個級別組合在一起

我的小提琴在這里並且非常基本。 它只是拆分出一堆行：

symbol
financials.0.date
financials.0.Revenue
financials.0.Revenue Growth
financials.0.Cost of Revenue
financials.0.Gross Profit
financials.0.R&D Expenses
financials.0.SG&A Expense
financials.0.Operating Expenses
financials.0.Operating Income
financials.0.Interest Expense
financials.0.Earnings before Tax
financials.0.Income Tax Expense
financials.0.Net Income - Non-Controlling int
financials.0.Net Income - Discontinued ops
financials.0.Net Income
...
...
inancials.10.Weighted Average Shs Out
financials.10.Weighted Average Shs Out (Dil)
financials.10.Dividend per Share
financials.10.Gross Margin
financials.10.EBITDA Margin
financials.10.EBIT Margin
financials.10.Profit Margin
financials.10.Free Cash Flow margin
financials.10.EBITDA
financials.10.EBIT
financials.10.Consolidated Income
financials.10.Earnings Before Tax Margin
financials.10.Net Profit Margin
AAPL
2019-09-28
2.60174e+11
0.0
1.61782e+11
98392000000.0
16217000000.0
18245000000.0
34462000000.0
63930000000.0
3576000000.0
65737000000.0
10481000000.0
0.0
0.0
55256000000.0
0.0
55256000000.0

$(document).ready(function() {
  var rows = [];
  var d = flatten(data);
  rows.push(Object.keys(d));
  rows.push(Object.values(d));

  for (var i = 0; i < rows.length; i++) {
    for (var j = 0; j < rows[i].length; j++) {
      var k = "<div>" + rows[i][j] + "</div>";
      if (i === 0) {
        $("#headers").append(k);
      } else {
        $("#results").append(k);
      }
    }
  }
});

我需要一種按標題對數據進行分組的格式，以便financials.0.date和financials.1.date等都組合在一起。 像這樣：數據組合在一起的地方

Answer 1

為什么不創建 div，而是將 json 數據輸入到表行中。 這就是您鏈接的圖像顯示數據的方式。 標題可以在 th 元素中，提供相同的外觀和感覺。

Answer 2

創建一個 thead 元素並放置 th 或標題。 讓您的代碼在 tr 元素內的 td 元素中生成數據行，這將正確組織您的代碼