在前边提到过的二维数组的循环与遍历，如今由于项目需求的变化，导致在数据中出现一些三维数组，听着比二维数组多了一维，其实也差不多，相信前边看过我对二维数组操作的看下面的也就不觉得难了，直接上上代码：
下面是一个二维数组：主要问题就是如何渲染到页面导航栏中
Menulist=[
{
modetitle:'UI库',
modericon:'icon-caidan',
moudlehref:'systemset/download.jsp',
// modearrow:'menu_dropdown-arrow',
list:[]
},
{
modetitle:'菜单设计',
modericon:'icon-DataAnalysis',
modearrow:'menu_dropdown-arrow',
list:[
{
"modename":"菜单管理","datahref":"goMenuList.do"
}
]
},
{
modetitle:'新增模块开发',
modericon:'icon-zidingyi',
modearrow:'menu_dropdown-arrow',
list:[
{
"modename":"新增模块管理","datahref":"custom-module.jsp"
},
{
"modename":"自定义SQL管理","datahref":"smoduleSQL!querySQLModule.do"
},
{
"modename":"共享参数设置","datahref":"systemset/getSystemSet.do"
}
]
},
{
modetitle:'模块库',
modericon:'icon-zidingyi',
modearrow:'menu_dropdown-arrow',
list:[
{
"modename":"固定模块管理","datahref":"fixedModule!queryFixedModule.do"
},
{
"modename":"问卷调查配置","datahref":"basedata/getQuestionParams.do"
},
{
"modename":"一维码/二维码系统","datahref":"javascript:void(0)",
"modearrow":'menu_dropdown-arrow',
"droplist":[
{
"modename":"串码属性填充定义","datahref":"serialCodeModule!queryModule.do"
},
{
"modename":"串码属性","datahref":"basedata/getStringCodeList.do"
}
]
}
]
},
{
modetitle:'后台web',
modericon:'icon-ziduanguanli',
modearrow:'menu_dropdown-arrow',
list:[
{
"modename":"后台web","datahref":"systemset/download.jsp"
},
]
},
{
modetitle:'参数设计',
modericon:'icon-shouye1',
modearrow:'menu_dropdown-arrow',
list:[
{
"modename":"系统模块设定","datahref":"getCompModuleList.do"
},
{
"modename":"帮助设定","datahref":"systemset/helpQuery.do"
},
{
"modename":"首页","datahref":"systemset/systemTopInfo.do"
},
{
"modename":"清除设备号","datahref":"basedata/clearDeviceIdInit.do"
},
{
"modename":"参数设定","datahref":"systemset/systemParams.do"
}
]
},{
modetitle:'应用库',
modericon:'icon-jiekouguanli',
modearrow:'menu_dropdown-arrow',
list:[
{
"modename":"现场扩展属性","datahref":"getStoreExp.do"
},
{
"modename":"考勤规则设定","datahref":"basedata/setAttendRuleInit.do"
}
,{
"modename":"任务目标管理","datahref":"visitTargetInit.do"
},
{
"modename":"任务设定","datahref":"visitTask!goVisitTaskList.do"
},
{
"modename":"单据配置","datahref":"order!getOrderConf.do"
},
{
"modename":"新单据配置","datahref":"orderNew!getOrderConf.do"
},
{
"modename":"单据2015","datahref":"newOrder!getOrderConf.do"
},{
"modename":"配送配置","datahref":"carsales!getCarsalesconfig.do"
}
]
},
{
modetitle:'手机客户端下载',
modericon:'icon-app',
moudlehref:'systemset/download.jsp',
list:[]
},
{
modetitle:'系统库',
modericon:'icon-52',
moudlehref:'systemset/download.jsp',
list:[]
}
]
var html='';
for(var i=0;i<Menulist.length;i++){
html+='<dl>'
html+='<dt>'
if(Menulist[i].moudlehref&&Menulist[i].moudlehref!=''){
html+='<a datahref="'+Menulist[i].moudlehref+'" >'
}else{
html+='<a datahref="javascript:void(0)" >'
}
if(Menulist[i].modearrow&&Menulist[i].modearrow!=''){
html+='<i class="iconfont '+Menulist[i].modericon+'"></i>'+Menulist[i].modetitle+'<i class="Hui-iconfont menu_dropdown-arrow"></i>'
}else{
html+='<i class="iconfont '+Menulist[i].modericon+'"></i>'+Menulist[i].modetitle
}
html+='</a>'
html+='</dt>'
html+='<dd>'
html+='<ul>'
for(var j=0;j<Menulist[i].list.length;j++){
html+='<li style="display: block;">'
if((Menulist[i].list)[j].modearrow&&(Menulist[i].list)[j].modearrow!=''){
html+='<a datahref="'+(Menulist[i].list)[j].datahref+'">'+(Menulist[i].list)[j].modename+'<i class="Hui-iconfont menu_dropdown-arrow snaji"></i></a>'
}else{
html+='<a datahref="'+(Menulist[i].list)[j].datahref+'">'+(Menulist[i].list)[j].modename+'</a>'
}
if((Menulist[i].list)[j].droplist){
html+='<ul class="droplist">'
for(var k=0;k<(Menulist[i].list)[j].droplist.length;k++){
html+='<li style="display: block;">'
html+='<a datahref="'+(Menulist[i].list)[j].droplist[k].datahref+'">'+(Menulist[i].list)[j].droplist[k].modename+'</a>'
html+='</li>'
}
html+='</ul>'
}
html+='</li>'
}
html+='</ul>'
html+='</dd>'
html+='</dl>';
}
$('#menu').html(html);