ExtJS专题（十一）:lTree的Treepanel使用

   最近学习extjs发现了一个问题，extjs是一个JavaScript的框架，属于前端页面上的，所有完全可以和后天的语言分离，大家在extjs的官方例子中可以看到都是html的格式。也就是说和后台结合的话也是按照某种方式传输数据，干什么又加上各种语言的各种框架。简单问题复杂化。 
    现在通过例子说明一下。 
.net代码 
  1. <%@ page language="java" contentType="text/html; charset=UTF-8"  pageEncoding="UTF-8"%>  
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
  3. <html>  
  4. <head>  
  5. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
  6. <title>Virgo_S</title>  
  7. <link rel="stylesheet" type="text/css" href="extjs/ext-all.css" />  
  8. <script type="text/javascript" src="extjs/ext-base.js"></script>  
  9. <script type="text/javascript" src="extjs/ext-all.js"></script>  
  10. <script type="text/javascript" src="extjs/ext-lang-zh_CN.js"></script>  
  11. <script type="text/javascript">  
  12. Ext.onReady(function(){   
  13.       //定义树的跟节点   
  14.       var root=new Ext.tree.TreeNode({   
  15.             id:"root",//根节点id   
  16.             text:"我是树根"   
  17.       });   
  18.         
  19.       //定义树节点   
  20.       var c1=new Ext.tree.TreeNode({   
  21.         id:'c1',//子结点id   
  22.         text:'大儿子'   
  23.       });   
  24.       var c2=new Ext.tree.TreeNode({   
  25.         id:'c2',   
  26.         text:'小儿子'   
  27.       });   
  28.       var c22=new Ext.tree.TreeNode({   
  29.         id:'c22',   
  30.         text:'大孙子'   
  31.       });   
  32.   
  33.       root.appendChild(c1);//为根节点增加子结点c1   
  34.       root.appendChild(c2);//为c1增加子节点c2，相信你已经找到规律了吧^_^   
  35.       c1.appendChild(c22);//为c1增加子节点c22   
  36.   
  37.       //生成树形面板   
  38.       var tree=new Ext.tree.TreePanel({   
  39.         renderTo:"tree",   
  40.         root:root,//定位到根节点   
  41.         animate:true,//开启动画效果   
  42.         enableDD:false,//不允许子节点拖动   
  43.         border:false,//没有边框   
  44.         rootVisible:false//设为false将隐藏根节点，很多情况下，我们选择隐藏根节点增加美观性   
  45.      });   
  46.   
  47. });   
  48. </script>  
  49. </head>  
  50. <body>  
  51. <div id="tree" style="height: 500px;  500px;"></div>  
  52. </body>  
  53. </html>  

【推广】 免费学中医，健康全家人
原文地址：https://www.cnblogs.com/Leo_wl/p/1683715.html