1.安装: 我用的bower工具，所以执行: bower install ztree 2.详细功能与配制，请考官方文档： http://www.treejs.cn/v3/main.php#_zTreeInfo 3.代码: <!DOCTYPE html> <HTML> <HEAD> <TITLE>zTree测试</TITLE> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" href="../bower_components/ztree/css/zTreeStyle/zTreeStyle.css" type="text/css"> <script type="text/javascript" src="../js/jquery-3.3.1.js"></script> <script type="text/javascript" src="../bower_components/ztree/js/jquery.ztree.all-3.5.js"></script> <SCRIPT LANGUAGE="JavaScript"> var zTreeObj; // zTree 的参数配置，深入使用请参考 API 文档（setting 配置详解） var setting = {}; // zTree 的数据属性，深入使用请参考 API 文档（zTreeNode 节点数据详解） var zNodes = [ {name:"系统管理", open:true, children:[ {name:"增加"}, {name:"删除"}]}, {name:"用户管理", open:true, children:[ {name:"激活"}, {name:"修改"}]} ]; $(document).ready(function(){ zTreeObj = $.fn.zTree.init($("#first"), setting, zNodes); }); </SCRIPT> </HEAD> <BODY> <div> <ul id="first" class="ztree"></ul> </div> </BODY> </HTML>
4.效果：
