我正试图用我有限的jQuery知识弯曲一些现有的代码,很好,我正在学习,我试图做一个带有链接的嵌套列表,最终结果将是列表的顶层是"类别",然后是一个使用"url"和"text"链接的嵌套UL.
(我不在乎顶层是否链接,我可以修改代码的这一部分)
任何帮助都会受到欢迎.
$(document).ready(function () {
var $ul = $('<ul></ul>');
var usefullinks = [
{
"category": "Category 2",
"links": [
{
"url": "https://example.org",
"text": "Some Link"
}
]
},
{
"category": "Test",
"links": [
{
"url": "http://google.net",
"text": "Link 1"
},
{
"url": "https://example.com",
"text": "Link 2"
}
]
}
];
getList(usefullinks, $ul);
$ul.appendTo(".main");
});
function getList(item, $list) {
if($.isArray(item)){
$.each(item, function (key, value) {
getList(value, $list);
});
return;
}
if (item) {
var $li = $('<li/>');
if (item.category) {
$li.append($('<a href="#">' + item.category + '</a>'));
}
if (item.links && item.links.length) {
var $sublist = $('<ul/>');
getList(item.links, $sublist);
$li.append($sublist);
}
$list.append($li)
}
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="main">
</div>