树形结构–zTree
API文档链接
代码示例：
//html
<script type="text/javascript" src="jquery-1.4.2.js"></script>
<script type="text/javascript" src="jquery.ztree.core-3.2.js"></script>
<body>
<ul id="tree" class="ztree" style="width:230px; overflow:auto;"></ul>
</body>
//js
var setting = {
view: {
selectedMulti: false
}
},
zTreeNodes = [
{"name":"根节点", open:true, checked:true,id:,pid:},
{"name":"一级目录（1）", open:true, checked:true,id:,pid:},
{"name":"一级目录（2）", open:true, checked:false,id:,pid:},
{"name":"二级目录", open:true, checked:true,id:,pid:}
];
$(document).ready(function(){
var zTreeObj = $.fn.zTree.init($("#tree"), setting, zTreeNodes);
//选择操作后执行handleData方法
function handleData(){
//获取id为tree的 zTree 对象，返回值是选中节点的数组形式
var treeObj = $.fn.zTree.getZTreeObj("tree");
}
});
数据需标明名称：name，自身id：id，父级id：pid，以及选中与否：checked
![ztree 增删改[图]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)