function fun_getTreeNodeHtml(dataArr,isFilterChild,kingId){
var classHidden = (isFilterChild) ? 'initHidden' : '' ;
var htmlStr = '<ul class="'+ classHidden +'">';
var liStr = '';
for(var i=0; i<dataArr.length; i++){
var item = dataArr[i];
var childSize = item.childItems.length;
var labelClass = (childSize==0) ? '' : 'moreItem';
var iconStr = (childSize==0) ? '' : '<span class="icon"></span>' ;
var checkBoxStr = (childSize==0) ? '<input type="checkbox" class="checkItem"/>' : '' ;
//var titleTextStr = titleText ? titleText+'/'+item.Describe_CN : item.Describe_CN
var kingId = (kingId) ? kingId : item.Kind ;
liStr += '<li><label class="'+ labelClass +'" data-kind="'+ kingId +'" data-id="'+ item.DangerousCargoCodeID +'" data-text="'+ item.Describe_CN +'">'+ iconStr + checkBoxStr + item.Describe_CN +'</label>'
if(childSize){
liStr += fun_getChildNodeHtml(item.childItems,kingId)
}else{
liStr += '</li>'
}
}
htmlStr += liStr + '</ul>'
return htmlStr
}
function fun_getChildNodeHtml(childDataArr,kingId){
var htmlStr = fun_getTreeNodeHtml(childDataArr,true,kingId)
return htmlStr;
}
var dataArr = [{
"Kind": 1,
"ParentID": 0,
"Describe_CN": "",
"childItem": [{
"Kind": 1,
"ParentID": 29,
"Describe_CN": "",
"childItems": [],
}, {
"Kind": 1,
"ParentID": 29,
"Describe_CN": "",
"childItems": [{
"Kind": 1,
"ParentID": 29,
"Describe_CN": "",
"childItems": []
}]
}]; //tree結(jié)構(gòu)數(shù)據(jù) 參考數(shù)據(jù)
var HTML = fun_getTreeNodeHtml(dataArr,false,'')
前端 js渲染樹結(jié)構(gòu)數(shù)據(jù)
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。
相關(guān)閱讀更多精彩內(nèi)容
- 前言 四月春光晴方好,斜風(fēng)微醉不須歸。北京的春,這么美,那么艷。青草聯(lián)排,春花爛漫。不過,有的時候,這春風(fēng),倒是有...
- ?作者:周周本文為原創(chuàng)文章,轉(zhuǎn)載請注明作者及出處 description: 回想起了一段往事,現(xiàn)在回過頭來看,蠻有...
- js 數(shù)據(jù)結(jié)構(gòu)類型擴(kuò)展:immutable-js 相對 java、.net 之類的強(qiáng)類型語言,js 有一點(diǎn)很大的區(qū)...
- 樹是一種非線性的數(shù)據(jù)結(jié)構(gòu),以分層的方式存儲數(shù)據(jù)。樹被用來存儲具有層級關(guān)系的結(jié)構(gòu),比如文件系統(tǒng)中的文件;樹還被用來存...
- 1. 樹結(jié)構(gòu)示意圖 補(bǔ)充: 兄弟節(jié)點(diǎn):具有相同父節(jié)點(diǎn)的節(jié)點(diǎn)互稱為兄弟節(jié)點(diǎn)。 樹的深度:從根節(jié)點(diǎn)開始(其深度為0)自...