java使用jquery将父/子数据转换为HTML树结构

Question

我有一个Java列表，其中包含具有层次数据（id、名称、parentId）的对象，需要生成一个HTML树结构（使用类似DynaTree的东西），并具有展开/折叠功能。我看到的所有示例都需要生成嵌套的<ul>结构来表示父/子//n-子/层次结构等

我可以转换数据来构建这个结构。但是，我认为这种数据格式将以其当前的形式（id/name/parentId）工作。有没有可以处理这些数据的jquery API

下面是一个简短的例子

//Category has an id, name, parentId
List<Category> categoryTree = new ArrayList<Category>();
categoryTree.add(new Category(1, 'root', null));
categoryTree.add(new Category(2, 'colors', 1));
categoryTree.add(new Category(3, 'blue', 2));
categoryTree.add(new Category(4, 'red', 2));
categoryTree.add(new Category(5, 'shapes', 1));
categoryTree.add(new Category(6, 'round', 5));

//now, I need to convert this to dynamic javascript to build the tree structure (<ul>, etc)

我以前使用过类似的SmartGWT，将其转换为树节点结构非常简单（请参见this example）。我认为有一个jQuery API可以做同样的事情。。。也许不是

Answer 1

这是一个可能会有所帮助的演示

http://jsfiddle.net/charlietfl/pCsZ3/

它用不多的jQuery解析无限深的对象，并且只对整个树使用一个DOM追加

如果从列表中进行解析，那么首先创建对象会更有效，否则会对DOM进行大量额外的附加，这不是很有效