jQuery jstree是一個簡單易用的插件，可以輕松地創建交互式樹形結構。它使用HTML、JS、CSS三種語言，完全兼容jQuery，提供了豐富的API和事件，可以實現樹形結構的展開、收縮、選擇、拖拽、編輯等功能，同時支持異步數據加載和動態節點操作。
下面是一個簡單的jQuery jstree demo：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jQuery jstree Demo</title>
<link rel="stylesheet" />
</head>
<body>
<div id="tree">
<ul>
<li>節點1
<ul>
<li>節點1.1</li>
<li>節點1.2</li>
</ul>
</li>
<li>節點2
<ul>
<li>節點2.1</li>
<li>節點2.2</li>
</ul>
</li>
</ul>
</div>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/jstree.min.js"></script>
<script>
$(function () {
$('#tree').jstree();
});
</script>
</body>
</html>代碼解釋：
1. 通過鏈接載入jstree的CSS和JS文件。
2. 在body中創建一個id為"tree"的div。
3. 在div中創建一個ul，包含兩個li節點。
4. 在頁面底部載入jQuery和jstree的JS文件。
5. 在文檔就緒時，調用jstree()函數對#tree進行渲染。當你運行此代碼時，你將看到一個帶有默認主題的樹形結構，包含四個節點。當你點擊節點時，將會選擇該節點。如果你試圖拖動節點，你將發現它不支持拖動，因為我們沒有啟用它。如果你需要更多的功能，在jstree的文檔中將有更多的解釋。