框架下载地址：https://www.layui.com/

1、tree树状菜单的使用：

html

<div class="cl pd-5 bk-gray mt-10" style="min-height:400px;">
  <ul id="treeMenu"> </ul>
</div>

js

$(function(){ 
	layui.use("tree", function(){
	    var tree = layui.tree; 
	    //渲染
	    var inst1 = tree.render({
	      elem: '#treeMenu'  //绑定元素
	      ,data: {$data}
	      ,edit:['add','update','del']
		  ,operate:function(obj){
	    	  	var type = obj.type; //得到操作类型：add、edit、del
	    	    var data = obj.data; //得到当前节点的数据
	    	    var elem = obj.elem; //得到当前节点元素 
				if(type=='add'){
					add_child(data.id);
				}
				else if(type == 'update'){
					$("input[name='id']").val(data.id);
					$("input[name='title']").val(data.title);
					$("input[name='name']").val(data.name);
					$("#edit_sort").val(data.sort);
					if(data.show == '0'){ 
			    		$("#edit_is_show_0").attr('checked',true);
			    		$("#edit_is_show_1").attr('checked',false);
					} 
					if(data.show == '1'){
			    		$("#edit_is_show_0").attr('checked',false);
			    		$("#edit_is_show_1").attr('checked',true);
					}
				    $('#thinkright-edit').modal('show'); 
					return;
				}
				else if(type == 'del'){
					if(confirm('确定删除？')){
						window.location='url';
					}	
				} 
			  }
	    });
	  }); 
})