`

JS 动态树 异步加载树 xloadtree WebFXLoadTree

阅读更多

 资料地址:
http://webfx.eae.net/dhtml/xloadtree/xloadtree.html

概述:
XLoadTree 可以实现异步加载树,主要是通过读取XML数据流,生成嵌套DIV的方式做展现.

如果数据量较小可以使用本组件,建议单层不要超过200个节点数。


其中有好几个对象WebFXTree\WebFXTreeItem\WebFXLoadTreeItem,它们之间有什么不同本人没研究过,因为找到了一个可以满足我现在的需求,我就直接用了。

我用的是WebFXLoadTreeItem

//WebFXLoadTreeItem的用法可以参考xloadtree.js里的function WebFXLoadTreeItem(sText, sXmlSrc, sAction, eParent, sIcon, sOpenIcon) {}

//http://www.xx.com/xx.do 是可以写回XML流的访问地址
var tree = new WebFXLoadTreeItem("Root", "http://www.xx.com/xx.do");
tree.build();


//返回的XML格式类似于
<?xml version="1.0" encoding="UTF-8"?>
<!-- action属性可以是URL或JS函数等 -->
<!-- 如果有子节点,请将src属性写上查询子节点的地址(返回格式同本XML介绍),
本人的实验结果是,如果没有子节点,请不要配置src属性;
如果src指定的地址返回了不正确的XML,浏览器会提示错误。
 -->
<TreeNode text="Root" action="javascript:xx();" src="http://www.xx.com/xx.do">
   <!-- 我是叶子节点 --> 
   <TreeNode text="Level1"  action="javascript:xx();"  /> 
   <!-- 我还有子节点,可以双击或点加号继续查询 -->  
   <TreeNode text="Level2"  action="javascript:xx();"  src="http://www.xx.com/xx.do"/> 
</TreeNode>



-----------------------------------
附件是从官网下的DEMO,为了方便只能上JE网站的人。
分享到:
评论

相关推荐

    webfxloadtree 树

    【webfxloadtree 树】是一种基于JavaScript的动态树形组件,主要应用于Web开发中,用于展示层次结构的数据。在网页设计中,这种组件能够帮助用户以清晰、交互的方式查看和操作多级数据,比如文件系统目录、组织结构...

    xloadtree资源包

    "XLoadTree资源包"是专门为构建Web应用中的目录树视图而设计的,它集成了JavaScript(js)和CSS(css)文件,以及相关的API文档,为开发者提供了全面的工具来实现交互式的、可扩展的树状结构展示。这个资源包的核心...

    Java项目中树形菜单的创建PPT课件.ppt

    XLoadTree是一个基于JavaScript和XML的优秀AJAX树控件,允许异步加载数据。引入必要的脚本文件后,可以创建一个能够动态加载数据的树形菜单。例如: ```html &lt;!-- 引入xtree script file --&gt; ...

    人员树js代码仅供大家参考一下

    - 使用 `new WebFXLoadTree("根节点名称", "XML数据源路径")` 创建一个动态加载数据的树对象。 - 调用 `write()` 方法将树写入页面。 - 此时,树中的数据将从指定的 XML 文件中动态加载。 #### 3. XML 文件结构 - ...

    XTree_javascript_树型菜单

    XLoadTree 与 XTree 的主要区别在于,XTree 只能生成静态树,而 XLoadTree 可以根据 XML 数据动态生成树形结构。XLoadTree 包含两个核心类:`WebFXLoadTree` 和 `WebFXLoadTreeItem`,它们分别继承自 `WebFXTree` 和...

    dtree 例子 学习笔记

    `WebFXLoadTree`对象类型主要用于创建实际的树根节点,并可以从XML文件加载树节点填充整个树结构。它是`WebFXTree`的扩展,继承了`WebFXTree`的所有属性和方法,因此提供了丰富的功能。 构造函数`new WebFXLoadTree...

    基于Ajax技术的树型结构目录的实现

    1. **动态加载技术**:通过Ajax的XMLHTTP组件XMLHTTPRequest对象异步发送请求,实现按需加载。 ```javascript /* 判断是否已经加载数据,未加载则访问服务器加载数据 */ dhtmlTree.prototype.Load = function ...

    毕业设计日记

    - **WebFXLoadTree**:用于加载XML文件并将其转换为动态树形结构。为了避免加载过慢,建议保持**tree_a.xml**文件体积适中。 2. **Ajax技术的应用**: - Ajax技术(Asynchronous JavaScript and XML)允许网页在...

Global site tag (gtag.js) - Google Analytics