Не включать корневой каталог в дерево HTML - PullRequest
0 голосов
/ 08 ноября 2019

Я написал функцию для создания дерева HTML из JSON.

async function traverseTree (list, node) {
  const li = document.createElement('li')
  if (node.kids) {
    const
      ul = document.createElement('ul'),
      span = document.createElement('span')
    span.innerText = node.name
    li.appendChild(span)
    li.appendChild(ul)
    list.appendChild(li)
    for (const kid of node.kids) {
      traverse(ul, kid)
    }
    return list
  }
  li.innerText = node.name
  list.appendChild(li)
  return list
}

;(async function(){
  const
    tree = await readJson('./tree.json'),
    list = document.createElement('ul'),
    output = await traverseTree(list, tree)
  console.log(output)
})()

Проблема в том, что я не хочу отображать корневой узел в дереве HTML, поскольку он уже отображается в другом месте. поэтому я изменил код, чтобы исключить его.

async function traverseTree (list, node, isNotRoot) { // additional parameter
  const li = document.createElement('li')
  if (node.kids) {
    let ul = list                                     // now let
    if (isNotRoot) {                                  // additional conditional
      const span = document.createElement('span')
      ul = document.createElement('ul')               // additional assignment of value
      span.innerText = node.name
      li.appendChild(span)
      li.appendChild(ul)
      list.appendChild(li)
    }
    for (const kid of node.kids) {
      traverseTree(ul, kid, true)                     // additional argument
    }
    return list
  }
  li.innerText = node.name
  list.appendChild(li)
  return list
}

Мне интересно, есть ли лучший, более чистый способ сделать это?

...