我使用拖放构建器的JavaScript创建动态JSON,现在我无法将JSON转换为嵌套的UL LI。JSON在下面。
[
{
"id": "11",
"name": "BALANCE"
},
{
"id": "p1",
"name": "Conditions",
"nodes": [
{
"id": "p1-13",
"name": "SPINAL CORD INJURY",
"nodes": [
{
"id": "p1-13-12",
"name": "STROKE",
"nodes": [
{
"id": "p1-13-12-17",
"name": "REACHING"
}
]
}
]
}
]
},
{
"id": "p1-16",
"name": "STRETCHES"
},
{
"id": "p1-11",
"name": "BALANCE"
}
]
您可以创建一个function
并在项目中有nodes
时递归致电。
var json = [{"id":"11","name":"BALANCE"},{"id":"p1","name":"Conditions","nodes":[{"id":"p1-13","name":"SPINAL CORD INJURY","nodes":[{"id":"p1-13-12","name":"STROKE","nodes":[{"id":"p1-13-12-17","name":"REACHING"}]}]}]},{"id":"p1-16","name":"STRETCHES"},{"id":"p1-11","name":"BALANCE"}];
function createUl(data, $elm) {
data.forEach(function(item) {
var $li = $('<li><span>' + item.name + '</span></li>');
$elm.append($li);
if (item.nodes) {
var $ul = $('<ul></ul>');
$li.append($ul);
createUl(item.nodes, $ul);
}
});
};
createUl(json, $('ul'));
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul></ul>