微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

javascript-如何从给定的json检索元素

我想从给定的json菜单中迭代每个数据
json是

var jsonMenu = {

    "menu": [
        {
            "MenuId": "ApplicationId",
            "MenuName": "Application",
            "MenuLink": "#",
            "Submenu":
                [
                    {
                        "MenuId": "BasicinformationId",
                        "MenuName": "Basic information",
                        "MenuLink": "#"
                    }
                ]
        },

        {
            "MenuId": "ReviewandSubmissionID",
            "MenuName": "Review and Submission",
            "MenuLink": "#"
        }

]
}

我使用给定的代码来迭代主菜单,并且可以正常工作

$.each(jsonMenu, function (key3, value3) {
                $('<li id="' + value3.MenuId + '" class="menu-li"><span><img src="../Images/tab_arrow.png"/></span><a href="' + value3.MenuLink + '">' + value3.MenuName + '</a></li>').appendTo("#menuLeft");
});

但是如何从给定的json检索子菜单

解决方法:

您应该在当前循环中使用另一个循环:

$.each(jsonMenu.menu, function (key, value) {
    var $li = $('<li id="' + value.MenuId + '" class="menu-li"><span></span><a href="' + value.MenuLink + '">' + value.MenuName + '</a></li>');
    if (value.Submenu) {
        var $ul = $('<ul/>').appendTo($li);
        $.each(value.Submenu, function (_, v) {
            $ul.append('<li><a href="#">' + v.MenuName + '</a>...</li>');
        });
    }
    $li.appendTo("#menu");
});

http://jsfiddle.net/7x5En/

为了提高效率,您还可以使用for循环而不是$.each()实用程序函数,并且为了避免生成嵌套的空ul元素(对于空的Submenu数组),可以使用typeof运算符检查Submenu属性是否存在:

if (typeof value.Submenu !== 'undefined' && value.Submenu.length) { // ...  }

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐