我编写了一个从JSON创建HTML树的函数。
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
}
我想知道是否有更好,更清洁的方法来解决这个问题?