javascript - XUL。 Tree.为什么子项会掉落？

Question

我有一个 XUL 树，它将包含一些动态 JSON 树。

我有 JSON(由我的 Win 应用程序生成):

{
    "Description": "",
    "id": "0x7183D2AD",
    "Name": "",
    "Children": [{
        "Description": "",
        "id": "0x660452D5",
        "Name": "Bookmarks menu",
        "Children": [{
            "Description": "",
            "id": "0x32DD7955",
            "Name": "Mozilla Firefox",
            "Children": []
        }]
    },
    {
        "Description": "",
        "id": "0x10EFAAFD",
        "Name": "Bookmarks panel",
        "Children": [{
            "Description": "",
            "id": "0x2542B587",
            "Name": "123",
            "Children": []
        }]
    },
    {
        "Description": "",
        "id": "0x39AD4290",
        "Name": "Tags",
        "Children": []
    },
    {
        "Description": "",
        "id": "0x464248E7",
        "Name": "unassigned bookmarks",
        "Children": []
    }]

我想用这个数据填充XUL树并实现结构(例如:这个JSON ^^):

• 书签菜单
• • Mozilla 火狐浏览器
• 书签面板
• • 123
• 标签
• 未分配的书签

我写了JS递归函数:

    JOToTreeNode: function(RootEl,JO) {
        var ti = document.createElementNS(XUL_NS,'treeitem');
        ti.setAttribute("id",JO.id);
        var tr = document.createElementNS(XUL_NS,'treerow');
        ti.appendChild(tr);
        var tc1 = document.createElementNS(XUL_NS,'treecell');
        var tc2 = document.createElementNS(XUL_NS,'treecell');
        tc1.setAttribute("label",JO.Name);
        tc2.setAttribute("label",JO.Description);
        tr.appendChild(tc1);
        tr.appendChild(tc2);        
        if (JO.Children.length > 0) {
            var child = document.createElementNS(XUL_NS,"treechildren");
            ti.appendChild(child);
            for (var i = 0; i < JO.Children.length; i++) {
             UtilCommon.JOToTreeNode(child,JO.Children[i]);    
            }
        };
        RootEl.appendChild(ti);
    }
...
    UpdateTree: function(el) {
        var els = el.getElementsByTagName("treechildren");
        //Drop the previous tree
            if(els.length > 0) {el.removeChild(els[0])};
        //Get JSON tree of groups
        var  http = new XMLHttpRequest();
        http.open("GET","http://"+this.host+":"+this.port+"/jsfolderstree",false);
        http.send(null);
        if (http.status == 200) { 
            var jtree = JSON.parse(http.responseText);
            var child = document.createElementNS(XUL_NS,"treechildren");
            el.appendChild(child);
            for (var i = 0; i < jtree.Children.length; i++) {
             UtilCommon.JOToTreeNode(child,jtree.Children[i]);
            };

    };
  }

它可以工作，但树只包含第一级节点，例如:

 - Bookmarks menu
 - Bookmarks panel
 - Tags
 - Unassigned bookmarks

如果我放置代码:

alert(JO.Name);

在 UtilCommon.JOToTreeNode 中，我会看到“123”和“Mozilla firefox”等子项存在，但不会作为子项添加到树中。

我的错误在哪里，当子项未附加到树上时如何修复错误？

谢谢。

Answer 1

根据 tree-XUL documentation ，您应该为嵌套树项设置container=true

...
if (JO.Children.length > 0) {
    ti.setAttribute("container", true);
    var child = document.createElementNS(XUL_NS,"treechildren");
    ti.appendChild(child);
    for (var i = 0; i < JO.Children.length; i++) {
       UtilCommon.JOToTreeNode(child,JO.Children[i]);    
    }
};
...