隱藏元素遞歸樹嵌套的兩倍以上

我有以下結構：隱藏元素遞歸樹嵌套的兩倍以上

var structure = { 
    name: 'root', 
    type: 'folder', 
    children: [ 
    { 
     name: 'aaa', 
     type: 'leaf' 
    }, 
    { 
     name: 'bbb', 
     type: 'leaf' 
    }, 
    { 
     name: 'folder2', 
     type: 'folder', 
     children: [...] 
    } 
    ] 
};

，我用它來創建類似的文件系統：

<table> 
    <tbody> 
    <tr class="folder"> 
     <td>folder</td> 
    </tr> 
    <tr class="children"> 
     <tr> 
     <td>Child1</td> 
     </tr> 
     <tr> 
     <td>Child2</td> 
     </tr> 
     <tr class="folder"> 
     <td>Folder 2</td> 
     </tr> 
     <tr class="children"> 
     <td>Child 3...</td> 
     </tr> 
    </tr> 
</table>

因此，一個文件夾包含兩個tr「 s - 一個名字，一個與孩子。孩子們可以沒有文件夾或文件夾本身的葉子。

這是代碼轉換結構的html：

var convert = function (data) { 
    var elements = document.createDocumentFragment(); 
    for (var i in data) { 
      var element = createTr(); 
      if (data[i].type == undefined) { // if is leaf 
       element.appendChild('some leaf text node'); 
      } else if (data[i].type === "folder") { 
       element.appendChild('some folder text node'); 
      } 
      elements.appendChild(element); 
      if (data[i].type === "folder") { 
       var element = createTr(convert(data[i].children)); 
       elements.appendChild(element); 
      } 
     } 
     return elements; 
    };

如何追加display: none在此功能時，嵌套級別高於2？如何在這個函數中獲得嵌套級別？

我試圖在遞歸調用中傳遞一個變量，但隨後每次有新文件夾時變量都會增加，而不是新的嵌套級別。

我該怎麼做？

編輯：這就是我試圖解決這個問題：

var convert = function (data, level) { 
     level = level || 0; 
     var elements = document.createDocumentFragment(); 
     for (var i in data) { 
       var element = createTr(); 
       if (data[i].type == undefined) { // if is leaf 
        element.appendChild('some leaf text node'); 
       } else if (data[i].type === "folder") { 
        element.appendChild('some folder text node'); 
       } 
       elements.appendChild(element); 
       if (data[i].type === "folder") { 
        var element = createTr(convert(data[i].children, ++level)); 
        elements.appendChild(element); 
       } 
      } 
      return elements; 
     };

來源

2016-08-24 user99999

當然！我編輯了我的帖子。事情是，每次在新文件夾上的級別變量都會增加，而不是新的嵌套。 – user99999

編輯和我的建議之間存在差異：'++ level'遞增當前範圍中的變量，而傳入'level + 1'則不會。（這就是爲什麼在我提出的代碼中，我有'nestingLevel + 1'，而不是'++ nestingLevel'。） - 如果這提供了您需要的信息以便將事物隱藏在給定的級別，請接受答案。 :) – Dennis

哇，這樣一個愚蠢的錯誤...非常感謝！ – user99999

你需要在你的深度傳遞和遞歸時加一。

即，你的函數應該是這樣的：

var convert = function (data, nestingLevel) { 
    var elements = document.createDocumentFragment(); 
    for (var i in data) { 
     var element = createTr(); 
     if (data[i].type == undefined) { // if is leaf 
      element.appendChild('some leaf text node'); 
     } else if (data[i].type === "folder") { 
      element.appendChild('some folder text node'); 
     } 
     elements.appendChild(element); 
     if (data[i].type === "folder") { 
      var element = createTr(convert(data[i].children, nestingLevel + 1)); 
      elements.appendChild(element); 
     } 
    } 
    return elements; 
}; 

// and pass in 0 when you are initially calling this function... 
convert(structure, 0);

來源

2016-08-24 15:35:18 Dennis

隱藏元素遞歸樹嵌套的兩倍以上

回答

相關問題