jstree jquery如何遍历所有节点

Question

我试图在jstree中遍历treeview中的每个节点。树视图有4层深，但我似乎无法越过第1层。下面是用于迭代的jQuery。

$("#myTree").bind('ready.jstree', function (event, data) {
    $('#myTree li').each(function () {
        // Perform logic here
        }
    });
});

这里是一个用来说明我观点的摆设。请帮助我如何迭代jstree中的每个节点。

Answer 1

这将在一个平面数组中为您的.each循环获取树的所有子级。

$("#tree").bind('ready.jstree', function(event, data) {
  var $tree = $(this);
  $($tree.jstree().get_json($tree, {
      flat: true
    }))
    .each(function(index, value) {
      var node = $("#tree").jstree().get_node(this.id);
      var lvl = node.parents.length;
      var idx = index;
      console.log('node index = ' + idx + ' level = ' + lvl);
    });
});

JSFiddle - json

Answer 2

另一种方法是在尝试访问dom中的节点之前打开它们，然后关闭它们：

$("#tree").bind('ready.jstree', function (event, data) {
  $(this).jstree().open_all(); // open all nodes so they are visible in dom
    $('#tree li').each(function (index,value) {
        var node = $("#tree").jstree().get_node(this.id);
        var lvl = node.parents.length;
        var idx = index;
        console.log('node index = ' + idx + ' level = ' + lvl);
    });
    $(this).jstree().close_all(); // close all again
});

Answer 3

“节点”是一个过载的术语。您指的是HTML节点还是仅用于定义jstree中每个节点的JSON数据？我需要迭代jstree，以便提取每个jstree节点中ID字段的值。如果这是您所需要的，那么有一个更简单的方法：

var v =$("#tree").jstree(true).get_json('#', {'flat': true});
for (i = 0; i < v.length && i < 10; i++) {
    var z = v[i];
    alert("z[id] = " + z["id"]);
}