自定義jQuery層次

Question

我現在使用jQuery根據用戶輸入動態生成DIV。由於這些產生和格式化的性質，DIV之間沒有直接的父母/子女關係。事實上，我想最簡單的解釋方法就是生成一棵樹。我希望能夠創建一個自定義層次結構，以便如果樹頂部的元素被刪除，所有它都是僞子元素。

下面是一個有點可視化的例子。該圖遵循水平等級。

Level 1 Level 2 Level 3 
----------------------------- 

    X  X   X \ 
         X | >> These 3 elements are pseudo-children of 
         X/ the first elements in level 1 and level 2 

      X <<<<<< X << The element in level 2 is pseudo-child of 
         X  the first element in level 1 

    X  X   X 

      X   X 
         X  

UPDATE：

代碼示例：

<tr> 
    <td>Level1</td> 
    <td>Level2</td> 
    <td>Level3</td> 
</tr> 
<tr> 
    <td /> 
    <td /> 
    <td>Level3</td> 
</tr> 
<tr> 
    <td /> 
    <td /> 
    <td>Level3</td> 
</tr> 
<tr> 
    <td /> 
    <td>Level2</td> 
    <td>Level3</td> 
</tr> 
<tr> 
    <td /> 
    <td /> 
    <td>Level3</td> 
</tr> 

等...（匹配圖）

Answer 1

我想你想要的是在HTML5的Flexible Box Module。見一個非常好的一套關於它here

而且操場http://flexiejs.com/playground/（用X瀏覽器以及JavaScript庫）的文章

---

我的猜測是在UI與表做到這一點的唯一方法也是在內存中存儲一​​棵樹，然後使用它來「知道」要刪除的內容。

---

也許我失去了一些東西，但什麼是不對的：

<div id="a"> 
    <div id="b"> 
     <div id="c" /> 
     <div id="d" /> 
     <div id="e" /> 
    </div> 
    <div id="f"> 
     <div id="g" /> 
     <div id="h" /> 
    </div> 
</div> 
<div id="i"> 
    <div id="j"> 
     <div id="k" /> 
    </div> 
    <div id="l> 
     <div id="m" /> 
    </div> 
</div> 



Level 1 Level 2 Level 3 
----------------------------- 

    a  b   c \ 
         d | >> These 3 elements are pseudo-children of 
         e/ the first elements in level 1 and level 2 

      f <<<<<< g << The element in level 2 is pseudo-child of 
         h  the first element in level 1 

    i  j   k 

      l   m 
         n