1 首選需要新增jquery的css和js。順序不能變（注意：有script標籤。一定要有</script>結尾。不然會出錯）
如：<link rel="stylesheet" type="text/css" href="./common/easyui/themes/icon.css">
<link rel="stylesheet" type="text/css" href="./common/easyui/themes/default/easyui.css">

<script type="text/javascript"  src="./js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="./common/easyui/jquery.easyui.min.js"></script>


2 首先要有初始化tree。通過data陣列可以給tree進行初始化,當然必須包括屬性id、text 如果有子節點則需要有children
<ul id="tt2"></ul>


然後通過jquery進行tree的初始化
如：jQuery.ready=function(){
$("#tt2").tree({
checkbox:false,
data:[
{id:'222',
text:'aa',
children:[{id:'111',text:'bb'},{id:'333',text:'ccc'}]
}
],
onContextMenu:function(e,node){

}
});
}


3 設定右鍵選單 ，設定一個div的class為easyui-menu然後div中包括幾個選單操作
如：<div id="div_menu" class="easyui-menu" style="width:100px">
    <div onclick="addNode()">新增子節點</div>
    <div onclick="editNode()">修改</div>
    <div onclick="delNode()">刪除</div>
    <div onclick="chakanNode()">檢視</div>
    </div>


4 將右鍵選單賜予給tree。這是需要在tree的onContextMenu函式中進行設定。
如：onContextMenu:function(e,node){//onContextMenu函式設定右鍵選單
//alert(e.pageX+"--"+e.pageY); e.pageX為滑鼠點選的X軸的座標 e.pageY為滑鼠點選的Y軸的座標
e.preventDefault();//這是去除網頁自帶的右鍵
$("#tt2").tree('select',node.target);//這是設定點選tree節點時選中該節點
$("#div_menu").menu('show',{//設定選單出現
left:e.pageX,
top:e.pageY

})
}


5 為tree新增節點。通過append即可。新增節點。
如：var node_=$("#tt2").tree("getSelected");
 
  var id_=getUUID();
  text_num=text_num+1;
  var text_="text"+text_num;
 
  $("#tt2").tree("append",{
  parent:node_.target,
  data:[{id:id_,text:text_}]
  })


6 刪除該節點。通過remove即可。
如：var node=$("#tt2").tree("getSelected");
  $("#tt2").tree("remove",node.target);


7 修改該節點內容。通過update即可。
如：var node_=$("#tt2").tree("getSelected");
  var text=node_.text;
  var shijian=new Date().getDate();
  text="text"+shijian;
  node_.text=text;
  $("#tt2").tree("update",node_);


8 檢視該節點。直接得到該節點。然後通過屬性即可。
如：var node=$("#tt2").tree("getSelected");
  alert(node.id+"---"+node.text);


綜上所述：新增節點--append方法。刪除節點--remove方法。修改節點--update。檢視節點--檢視屬性