zoukankan      html  css  js  c++  java
  • WEBFX XTREE学习笔记

    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 代码

    XML文件的例子:

     

    xml 代码
    1 
    • <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>  
  • 相关阅读:
    《ASP.NET Core跨平台开发从入门到实战》Web API自定义格式化protobuf
    .NET Core中文分词组件jieba.NET Core
    .NET Core 2.0及.NET Standard 2.0
    Visual Studio 2017 通过SSH 调试Linux 上.NET Core
    Visual Studio 2017 ASP.NET Core开发
    Visual Studio 2017正式版离线安装及介绍
    在.NET Core 上运行的 WordPress
    IT人员如何开好站立会议
    puppeteer(二)操作实例——新Web自动化工具更轻巧更简单
    puppeteer(一)环境搭建——新Web自动化工具(同selenium)
  • 原文地址:https://www.cnblogs.com/wen12128/p/1518966.html
Copyright © 2011-2022 走看看