jQuery UI是一個非常流行且易于使用的JavaScript庫，它提供了許多易于使用的界面組件和功能，其中包括樹表。

jQuery UI的樹表組件允許您輕松地創(chuàng)建帶有樹形結(jié)構的表格，可以展開和收起行來顯示或隱藏相關數(shù)據(jù)。使用jQuery UI的樹表組件，您可以輕松地實現(xiàn)帶有層次結(jié)構的數(shù)據(jù)表示，從而更好地展示您的數(shù)據(jù)。

<table id="treeTable">
<thead>
<tr>
<th>編號</th>
<th>名稱</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr class="treegrid-1">
<td>1</td>
<td>父節(jié)點 1</td>
<td class="text-center">
<a href="#">編輯</a>
</td>
</tr>
<tr class="treegrid-2 treegrid-parent-1">
<td>2</td>
<td>子節(jié)點 1-1</td>
<td class="text-center">
<a href="#">編輯</a>
</td>
</tr>
<tr class="treegrid-3 treegrid-parent-1">
<td>3</td>
<td>子節(jié)點 1-2</td>
<td class="text-center">
<a href="#">編輯</a>
</td>
</tr>
<tr class="treegrid-4">
<td>4</td>
<td>父節(jié)點 2</td>
<td class="text-center">
<a href="#">編輯</a>
</td>
</tr>
<tr class="treegrid-5 treegrid-parent-4">
<td>5</td>
<td>子節(jié)點 2-1</td>
<td class="text-center">
<a href="#">編輯</a>
</td>
</tr>
<tr class="treegrid-6 treegrid-parent-4">
<td>6</td>
<td>子節(jié)點 2-2</td>
<td class="text-center">
<a href="#">編輯</a>
</td>
</tr>
</tbody>
</table>

如上所示，使用jQuery的樹表組件需要指定每個行的class，并使用treegrid-XXX來指定層級關系，其中XXX是當前行的ID，而treegrid-parent-XXX則指定父級行的ID。此外，您還需要在該表格上調(diào)用treegrid()方法來啟用樹表。

在使用jQuery UI的樹表組件時，您還可以根據(jù)需要配置許多不同的選項，例如默認展開的行，展開和折疊所需的圖標，以及使用Ajax加載數(shù)據(jù)等。使用這些選項，您可以根據(jù)自己的需求自定義樹表的外觀和功能。