jstree中json data 的生成_jstree jsondata-CSDN博客

本文链接：https://blog.csdn.net/jenyzhang/article/details/45099443

本文介绍了如何将文件夹及其内容转换为jstree所需的JSON数据格式。通过递归遍历目录，提取每个文件和子目录的属性，生成包含id、parent和state的JSON结构。提供了一个用Java实现的示例代码，生成的JSON数据存储在E:/root.json，为后续使用jstree展示目录树提供数据。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

jstree中json data 的生成

jstree官网上给出的json数据格式是这样的：

<span style="font-size:14px;">// Alternative format of the node (id & parent are required)
{
  id          : "string" // required
  parent      : "string" // required
  text        : "string" // node text
  icon        : "string" // string for custom
  state       : {
    opened    : boolean  // is the node open
    disabled  : boolean  // is the node disabled
    selected  : boolean  // is the node selected
  },
  li_attr     : {}  // attributes for the generated LI node
  a_attr      : {}  // attributes for the generated A node
}</span>

如果我想要把一个文件夹及它里面的文件用jstree显示，怎么办呢？总不能自己再按上边的格式一个一个写吧。好了，这里就涉及到一个问题，怎么样把一个路径转化成json data.

举个例子：我在E盘下有一个test文件夹，我想要把test文件夹下的所有文件用jstree目录树显示。这时候jstree的数据源就应该是test文件夹的 json数据。

test文件夹下的目录结构如下图：

test文件目录它的json格式应该是这样的：

[{"attributes":{"id":"0"},"parent":"0","state":{"opened":false},"text":"test1" ,"children":[{"attributes":{"id":"1"},"parent":"0","state":{"opened":true},"text":"test1.1.txt" , "type":"leaf"  },{"attributes":{"id":"2"},"parent":"0","state":{"opened":true},"text":"test1.2.txt" , "type":"leaf"  }]  },{"attributes":{"id":"3"},"parent":"0","state":{"opened":true},"text":"test2.txt" , "type":"leaf" }]

上面的json格式中:

attributes:{id: }是每个节点的id.

parent:是这个节点的父节点的id

state:{opened:false} 表示的是这个节点的状态是不打开

children[]:表示的是这个节点的子节点。

如何把一个目录的路径，转化为上面的json格式呢？我们要用无限递归遍历这个目录，把相应信息提取出来，转化为json格式的字符串。

下面给出实现的代码：用java写的：

/**
 * 给定任意的路径 ，无限递归获得该路径下的所有节点，并转化为json串 ,把该json串存到root.json文件中， 用作jstree的数据源
 * @param f parent
 *        路径名 父节点ID 
 * @return str，然后将str写入文件中。
 * @author YanniZhang
 * @date 2015.4.17
 */
package test;

import java.io.File;
import java.io.FileWriter;
import java.io.BufferedWriter;
import java.io.IOException;

public class test {
	public static int parentId=0;
	public static String str="";
	public  static void main(String[] args) {
		
		 File f =new File("E:/test1");//给定的路径是E盘下的test文件夹。这里换成你想要转换成json串的任意路径
		 String str="[";
	        // 从根开始 ，调用ToJson()方法，把路径转化成json串。结果是str 
	        str+=ToJson(f,0);  
	        str += "]";  
	       /** 
	        * 把json串写入文件root.json中
	        * 
	        */
	        try {
				 
				   
				   File file = new File("E:/root.json");
				 
				   // if file doesn't exists, then create it
				   if (!file.exists()) {
				    file.createNewFile();
				   }
				 
				   FileWriter fw = new FileWriter(file.getAbsoluteFile());
				   BufferedWriter bw = new BufferedWriter(fw);
				   bw.write(str);
				   bw.close();
				 				   			 
				  } catch (IOException e) {
				   e.printStackTrace();
				  }
		
	}
  
	
	/*ToJson()方法，实现把指定路径转化为json串。采用无限递归遍历路径下的所有节点的方法实现*/
	 private  static String ToJson(File f,int parent) {
		 
		  //杳出顶层的子节点
		 
		  File[] files = f.listFiles();
		  
	
		  //遍历它的子节点
		  for(int i=0; i<files.length; i++) 
		  {		   
		   //有子节点
		   if(files[i].isDirectory())
		   {
			   
			  
			   str+= "{\"attributes\":{\"id\":\""  +parentId 
	                   + "\"},\"parent\":\""  + parent
	                   + "\",\"state\":{\"opened\":false},\"text\":\"" + files[i].getName() + "\" ,";  
			   str += "\"children\":["; 
			   parent=parentId;
			   parentId++;
			  
			   
			   
			   //遍历它的子节点
			   File[] list=files[i].listFiles();
			   for(int j=0;j<list.length;j++)
			   {
				
				 
				   if(list[j].isDirectory())
				   {
					   
					   //还有子节点（递归调用）
					   str+= "{\"attributes\":{\"id\":\""  +parentId 
			                   + "\"},\"parent\":\""  + parent
	                   + "\",\"state\":{\"opened\":false},\"text\":\"" + list[j].getName() + "\" ,";  
					   str += "\"children\":["; 
					   parent=parentId;
					   parentId++;
					  
					   ToJson(list[j],parent);
					   str+="]";
					   str+="  }";
					   if(j<list.length-1)
					   {
						   str+=",";
					   }
					  
					 
				   }
			   
			       else
			       {
				     str += "{\"attributes\":{\"id\":\"" + parentId  
                           + "\"},\"parent\":\""  + parent
	                   + "\",\"state\":{\"opened\":true},\"text\":\"" + list[j].getName()  
                           + "\" " + ", \"type\":\"leaf\"  }";  
				    
				     parentId++;
				    
                     if (j < list.length - 1)  
                     {  
                       str += ",";  
                     }
                   
					 
                     
                   }  
				   
			  }
			   str+="]";
			   str+="  }";
			   if(i<files.length-1)
			   {
				   str+=",";
			   }
		   }
		   
			   else
			   {
				   str += "{\"attributes\":{\"id\":\"" + parentId  
                           + "\"},\"parent\":\""  + parent
	                   + "\",\"state\":{\"opened\":true},\"text\":\"" + files[i].getName()  
                           + "\" " + ", \"type\":\"leaf\" }";  
				    parentId++;
                   if (i < files.length - 1)  
                   {  
                       str += ",";  
                   }  
               }  
		  
	 }
	 return str;
}
}

得到的json数据存在E:/root.json

得到了任意一个路径的json 数据后。我们就要用这个json数据生成目录树了。

如何利用上面生成的json数据请看下一篇博文：“jstree获得节点的相对路径”。