如何将缩进列表转换为表格？答案

【问题标题】：How to transform indented list to table?如何将缩进列表转换为表格？
【发布时间】：2020-06-12 09:32:22
【问题描述】：

大家好！

无论任务或平台如何，我都意识到我一遍又一遍地做着大致相同的事情。将列表转换为缩进列表，填补空白，合并数据，转换为可食用的 json。

使用 excel 时，虽然繁琐但很简单。如何使用 javascript（或 Node.js 解析器）执行相同的任务？

如果有人可以提供如何执行此任务的实时示例，我们将不胜感激。我是否使用 GREP 连接到数据级别？

样本数据（与图片相符）：

<h1 class="level1">Header content aa</h1>
<h1 class="level1">Header content ab</h1>
    <h1 class="level2">Header content ac</h1>
        <p>Content block a</p>
    <h1 class="level2">Header content ad</h1>
        <p>Content block b</p>
        <p>Content block c</p>
<h1 class="level1">Header content ae</h1>
        <p>Content block d</p>      
    <h1 class="level2">Header content af</h1>
        <p>Content block e</p>
<h1 class="level1">Header content ag</h1>
        <p>Content block f</p>
        <p>Content block g</p>

想要的结果是这样的：

[
 {
   "Topmost level": "Header content ab",
   "Sublevel": "Header content ac",
   "Content": "Content block a"
 },
 {
   "Topmost level": "Header content ab",
   "Sublevel": "Header content ad",
   "Content": "Content block b"
 },
 {
   "Topmost level": "Header content ab",
   "Sublevel": "Header content ad",
   "Content": "Content block c"
 },
 {
   "Topmost level": "Header content ae",
   "Sublevel": null,
   "Content": "Content block d"
 },
 {
   "Topmost level": "Header content ae",
   "Sublevel": "Header content af",
   "Content": "Content block e"
 },
 {
   "Topmost level": "Header content ag",
   "Sublevel": null,
   "Content": "Content block f"
 },
 {
   "Topmost level": "Header content ag",
   "Sublevel": null,
   "Content": "Content block g"
 }
]

我真的很想掌握如何使用 JS 执行此类任务的最佳实践。示例代码将是实现这一目标的最佳帮助。非常感谢您的宝贵时间。

【问题讨论】：

如何将这些数据保存为 HTML 或文件？更清楚地了解您的来源
感谢您的及时回复。这次我解析了 RSS - 这就是示例的来源。但我清楚地记得我必须做主语。当重组凌乱的内部 excel 表时，以及当我一直在为 d3.js 准备 json 以及有关城市的数据时。所以数据的来源并不像我想象的那么重要。

标签： javascript parsing data-structures

【解决方案1】：

您的结构需要读取每个标题子标题和内容，创建类似于每行数组的内容，然后通过使用最近的标题状态将内容添加到数组来减少它：

let h1, h2, h3; // for keeping track of last header state
[...document.querySelectorAll('body > *')].map((el) => [[...el.classList].join(' '), el.innerText]).reduce((result, [level, content]) => {
  switch (level) {
    case 'level1':
      h1 = content;
      h2 = null;
      h3 = null;
      break;
    case 'level2':
      h2 = content;
      h3 = null;
      break;
    default:
      h3 = content;
  }

  if (h1 && h3) {
    result.push({ "Topmost level": h1, "Sublevel": h2, "Content": h3 })
  }
  return result;
}, [])

【讨论】：