首先引入相应的ligerUI的css和js文件

1,html

<ul id="tree"></ul>

2,初始化

var treeData = [
{ 'name': '节点1', 'no':1 , 'children': [
{ 'name': '节点1.1','no':1 },
{ 'name': '节点1.2','no':2 },
{ 'name': '节点1.3', 'children': [
{ 'name': '节点1.3.1' },
{ 'name': '节点1.3.2' }
]},
{ 'name': '节点1.4' }
]
},
{ 'name': '节点2' }
];

$("#tree").ligerTree({
checkbox: false,
parentIcon: null,
childIcon: null ,
slide: false,//是否显示动画
nodeWidth: 100,
idFieldName: 'id',
textFieldName:'name' ,//指定数据中要显示的属性名,默认为"text"
data: treeData,
onSelect: function (node)
{
if (!node.data.name) {
return
};
//处理导航树的点击事件TODO

}
});
var tree = $("#tree").ligerGetTreeManager();

//tree.setData(treeData) ; //或者这样设值

运行结果: