数据用ztree基础显示树

本文介绍了如何使用ZTree创建基础的树形结构。首先,通过ZTree官网了解其基本信息,接着下载并引入插件到项目中。通过查看Demo理解配置对象和数据展示方式。在HTML中配置DOM节点,并结合JS数据进行绑定,最终实现在页面上显示一个简单的ZTree树形结构。
摘要由CSDN通过智能技术生成

首先我们要了解一下ztree:http://www.treejs.cn/v3/main.php#_zTreeInfo
在这里插入图片描述然后下载相关插件,点击下载,会跳转码云:
在这里插入图片描述按照步骤下载好插件后,引入我们需要写代码的文件里:
在这里插入图片描述然后我们可以点击网页的Demo展示,了解使用的过程:
在这里插入图片描述首先我们可以参考它的文件路径的html 了解大致的格式是怎么样的.

第一步 配置对象:

var setting = {
   };

第二步 显示数据,这里我们需要把刚刚整理好的js数据移过来(直接将上一篇代码移过来就行):

var course = [
			{
   id:1,name:'根编目',cate_path:null},
			{
   id:2,name:'Java课程',cate_path:'1.2'},
			{
   id:3,name:'Spring课程',cate_path:'1.2.3'},
			{
   id:6,name:'Servlet课程',cate_path:'1.2.6'},
			{
   id:4,name:'SpringBoot课程',cate_path<
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值