`
lylyb
  • 浏览: 90475 次
  • 性别: Icon_minigender_1
  • 来自: 烟台
社区版块
存档分类
最新评论

XTREE

    博客分类:
  • WEB
阅读更多
1.XTREE简介:

XTREE是一个基于AJAX实现的树形菜单。它的原理就是每次都只加载当前结点下的所有结点,而对开发人员来说,就是只需要按一定的格式,生成一段XML代码。XTREE可以自己定制每个结点的ICON和链接。XTREE是基于对象的,通过XTREE,你无需再自己生成HTML代码,而只要生成相应的JS 对象就可以了。

2.官方网址:

http://webfx.eae.net/dhtml/xtree/index.html,可以在这里下载到XTREE最新的版本,也有XTREE的演示的DEMO。

3.XTREE的API:

    XTREE的API很简单,就是一个抽象类WebFXTreeAbstractNode以及该抽象类的两个子类WebFXTree和WebFXTreeItem。这三个类的属性和构造函数,还有方法详见:http://webfx.eae.net/dhtml/xtree/api.html,上面写得很清晰。

4.XTREE学习笔记
    每个结点有一个状态叫做OPEN;如果结点为OPEN,则可以EXPAND;对于ITEM结点来说,永远返回FALSE;
    toggle()就是切换,如果为展开的,就收起;如果为收起的,就展开;
    XTREE生成的是静态树,它不能从XML中生成树,而是只能生成简单的静态的树,看构造函数的参数就可以知道【text】【action】
    --------------------------------------------------------------
    WebFXTreeAbstractNode:
   
    属性:
    id:唯一标识
    text: label
    action: 链接
    open: 标志位,boolean型,是否打开
    icon: 图标
    openIcon:打开时的图标
    parentNode:父结点的Reference
    childNodes: 子结点的Reference的集合
   
    方法:
    indent():缩进
    toggle():切换
    callapse():收起
    expand():展开
    callapseAll():收起全部
    expandAll():展开全部
    expandChildren():展开子结点
    callapseChildren():收起子结点
    getNextSibling():取得下一个兄弟结点的Reference
    getPreviousSibling():取得上一个兄弟结点的Reference
    toString():生成HTML代码
   
    ------------------------------------------------------------------
    WebFXTree:
   
    构造函数:new WebFXTree([text], [action], [behavior],[icon],[openIcon]);
   
    参数:
    text:
    action:
    behavior:
    icon:
    openIcon:
   
    属性:
    rendered 标志位,boolean类型,用于标记该树是否已经生成和显示。
    WebFXTreeAbstractNode的所有属性
   
    方法:
    getSelected():返回一个Reference,被选中的那个对象的Reference。
    setBehavior(sBehavior): classic,explorer;
    getBehavior():
    WebFXTreeAbstractNode的所有方法
    -------------------------------------------------------------------
    WebFXTreeItem:
    构造函数:
    new WebFXTreeItem([text],[action],[parent],[icon],[openIcon]);
   
    属性:
    WebFXTreeAbstractNode的所有属性
   
    方法:
    getFirst():返回第一个子结点的Reference
    getLast():返回嘴后一个子结点的Reference
    __________________________________________________________________________________________
   
5.XLoadTree学习笔记:
    XLoadTree与XTree的区别就在于,XTree只能生成静态树,而XLoadTree可以根据XML生成动态树。
    XLoadTree是由Xtree而来的,主要有两个类:WebFXLoadTree和WebFXLoadTreeItem,其中,WebFXLoadTree继承自WebFXTree,WebFXLoadTreeItem继承自WebFXTreeItem
    ---------------------------------------------------------------------
    WebFXLoadTree:
   
    构造函数:
    new WebFXLoadTree(sText, sXmlSrc, sAction, sBehavior, sIcon, sOpenIcon)
   
    参数:
    sXmlSrc:展开时需要用到的XML文件
    其余参数与WebFXTree一样
   
    属性:
    src: XML源文件
    loading: 标志位,boolean类型,表示正在加载XML文件
    loaded: 标志位,boolean类型, 表示XML文件已将加载完毕
    errorText: 错误描述
    WebFXTree中的所有属性
   
    方法:
    reload():重新加载XML文件
    WebFXTree中的所有方法
    -----------------------------------------------------------------------
    WebFXLoadTreeItem:
   
    构造函数:
    new WebFXLoadTreeItem(sText, sXmlSrc, sAction, eParent, sIcon, sOpenIcon)
    参数:
    eParent:可选,该结点要加入到的结点的Reference
   
    属性:
    src: XML源文件
    loading: 标志位,boolean类型,表示正在加载XML文件
    loaded: 标志位,boolean类型, 表示XML文件已将加载完毕
    errorText: 错误描述
    WebFXTree中的所有属性
   
    方法:
    reload():重新加载XML文件
    WebFXTreeItem中的所有方法
   
    XML文件的格式:
   

xml 代码
<!ELEMENT tree (tree*)>  
  <!ATTLIST tree   
            text      CDATA   #REQUIRED   
            src       CDATA   #IMPLIED   
            action    CDATA   #IMPLIED   
            icon      CDATA   #IMPLIED   
            openIcon  CDATA   #IMPLIED>  
           

    XML文件的例子:
   

xml 代码
<tree>  
   <tree text="Loaded Item 1" action="href://webfx.eae.net" />  
   <tree text="Loaded Item 2">  
    <tree text="Loaded Item 2.1" action="javascript:alert(2.1)" />  
   </tree>  
   <tree text="Load &quot;tree1.xml&quot;" src="tree1.xml" />  
</tree>
分享到:
评论

相关推荐

    xtree

    **xtree:深入理解与应用** xtree是一个用于数据结构表示和操作的工具,尤其在计算机科学和编程领域中,它被广泛应用于处理树形结构数据。本文将深入探讨xtree的基本概念、特点、用途以及如何在实际项目中有效地...

    扩展xtree选择树

    "扩展xtree选择树"是一种基于JavaScript实现的数据结构和用户界面组件,主要用于构建可交互的树形数据展示。在Web开发中,它被广泛应用于文件系统导航、组织结构展示、菜单系统等场景,通过xtree,用户可以方便地...

    xtree1.1和例子

    "xtree1.1和例子" 是一个与前端开发相关的主题,主要涉及到的是一个叫做 xtree 的库或者框架。这个库可能是一个用于构建交互式树形结构的JavaScript组件,适用于展示层级关系的数据,如文件系统、组织架构或者导航...

    xtree一颗完整的树xtree+oracle+struts

    "xtree"是一个专用于构建这种树形视图的组件,它常与数据库系统(如Oracle)以及MVC框架(如Struts)结合使用,以提供动态的数据加载和交互功能。 首先,我们来看"xtree"。Xtree是一个JavaScript库,主要用于在Web...

    xtree源包及使用实例

    **XTREE源包及使用实例详解** XTREE是一种用于构建动态树形结构的数据结构,它在计算机科学中常被用于组织和操作数据。这个数据结构允许高效地进行插入、删除和查找操作,特别适合处理层次化的信息。在IT行业中,...

    XTree

    "XTree"是一款用于网页开发的JavaScript库,专门设计用于创建和展示树状菜单结构。这个库被嵌套在HTML标签中,使得开发者能够轻松地在网页上构建交互式的、层级化的导航系统。XTree的核心功能是通过JavaScript动态...

    xTree

    **xTree:JavaScript实现的树形菜单** xTree是一款基于JavaScript技术开发的树形菜单组件。在网页设计中,树形菜单通常用于组织和展示层级结构的信息,如网站导航、文件系统或者数据库结构。xTree因其简洁易用、...

    XTree生成树状菜单

    在IT领域,尤其是在网页开发中,XTree是一种广泛使用的JavaScript库,用于创建交互式的树状菜单。这种菜单结构能够帮助用户以层次化的方式浏览和操作数据,尤其适用于组织大量分类信息,如文件系统、网站导航或者...

    树形结构xtree有添加和修改的功能。

    这个“xtree”项目显然是一个具有添加和修改功能的树形结构实现,可能是为了在网页上展示和操作层次化的数据。 首先,我们来了解一下树形结构的基础知识。树形结构是由节点(或称为元素)和边(或连接线)组成的...

    js树,xtree,纯js

    XTree是基于纯JavaScript实现的一种树状数据结构的控件,它提供了一种高效、灵活的方式来显示和操作树形数据。 **树形结构的基础知识:** 在计算机科学中,树是一种非线性数据结构,由节点(或称为顶点)和边组成。...

    XTree XML生成树 帮助文档

    《XTree XML生成树 帮助文档》 在IT领域,树形控件是一种常见的用户界面元素,它用于展示数据的层次结构。XTree是一款专门用于生成树形结构的工具,尤其适用于XML数据的展示。本文将详细介绍如何利用XTree来构建...

    xtree下载 树状图

    "xtree下载 树状图"这个标题暗示我们这里讨论的是一款名为xtree的软件或工具,它用于创建和查看树状图。xtree可能是提供了一种高效的方式,让用户能够一次性加载整个树形结构,以便于快速浏览和操作,正如描述中提到...

    _2010.05.30_xtree3 + xtree117 刘涛改进版.最好的树菜单,firefox下正常_终极推荐ok.7z

    《XTREE3与XTREE117刘涛改进版:最佳树形菜单在Firefox下的完美体验》 在网页设计和开发领域,树形菜单是一种常见的交互元素,它以树状结构展示信息,使得用户能够方便地浏览和操作复杂的层级数据。XTREE3与XTREE...

    完整的xtree例子 和jsp联系

    【XTreeDemo】是一个关于`xtree`与`jsp`结合使用的综合实例,它涵盖了`xtree`控件的各种功能和交互方式。`xtree`通常用于构建具有层级结构的数据显示,常见于文件系统、组织架构或者数据库树形视图等场景。在`jsp`...

    用js写的tree组件 xtree2

    XTree2是一款基于JavaScript编写的树形组件,用于在网页中构建可交互的层次结构数据展示。这个组件的第二部分可能包含对第一部分功能的扩展或优化,将所有代码集中在一个JS文件中,便于管理和维护。在Web开发中,...

    xtree3.1_非常优秀的树菜单_newtower修改增强.7z

    《XTREE3.1:优秀的树状菜单系统与NewTower的增强版本》 XTREE3.1是一款在Web开发中广泛使用的树形菜单系统,它以其高效、灵活和易用性而受到开发者们的青睐。这款软件的核心在于提供了一种结构化的、可扩展的方式...

    xTree帮助

    【xTree帮助】:在IT领域,尤其是在软件开发和数据管理中,xTree是一个非常有用的工具,它主要用于处理和操作树形结构的数据。xTree工具以其直观的界面和强大的功能,使得用户能够轻松地浏览、搜索、管理和分析复杂...

    xtree demo

    "xtree demo" 是一个基于JavaScript实现的树形数据结构展示工具的演示程序,它主要用于在Web应用中呈现层次结构的数据。在这个压缩包中,主要包含的文件是 "xtree.js",这是一个JavaScript库,提供了对树状数据进行...

    xtree开发包

    《xtree开发包详解》 在编程领域,数据结构与算法是基础中的基础,而树形数据结构在软件设计中有着广泛的应用。xtree作为一款专门用于开发的工具包,其核心在于提供了一种高效、灵活的树型数据结构,为开发者提供了...

Global site tag (gtag.js) - Google Analytics