树状结构图代码,JS代码库,德仔网

代码语言

代码分类

【JS】树状结构图

作者:请叫我汪海 / 发布于2014/4/8/ 675

```
<html> 
  <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF8"> 
    <title>Tree</title> 
    <link rel="stylesheet" type="text/css" href="js/extjs/resources/css/ext-all.css" /> 
    <script type="text/javascript" src="js/extjs/adapter/ext/ext-base.js"></script> 
    <script type="text/javascript" src="js/extjs/ext-all.js"></script> 
    <script type="text/javascript">
      Ext.onReady(function(){
        //创建一棵树
        var tree = new Ext.tree.TreePanel( 
          { 
            el: 'tree', //表示渲染的DOM的id.界面中有<div id = "tree"></div>相对应最后这棵树就出现在这个div位置上
            //TreeLoader完成数据转换和装配节点的功能 
            loader: new Ext.tree.TreeLoader({dataUrl: 'tree.txt'}) 
          } 
        );

        //设置根节点
        var root = new Ext.tree.AsyncTreeNode({text:'中国'}); 
        tree.setRootNode(root); 
        tree.render(); //对树进行渲染
        //只展开第一层节点 
        //root.expand(); 
        //展开全部节点 
        root.expand(true,true); 
      } 
    ); 
    </script> 
  </head> 
  <body> 
    <div id="tree" style="height:300px;width:200px"></div> 
  </body> 
</html>

评论列表

本站所提供的代码，版权归原作者所有，若有侵犯作者版权，请与我们联系，我们将立即删除或修改。谢谢!
本站所有代码发布及提供者。

试试其它关键字

　树状结构图　

同语言下

可能有用的

请叫我汪海贡献的其它代码(16)