`

常见JavaScript10大树控件

阅读更多

1.ExtJS TreePanels

ExtJS

        TreePanels 是ExtJS自身使用的树控件,它是目前最好用的树控件之一,它有诸多优点比如支持自由拖放,ExtJS本身就有非常完善的API和开发文档,但是商业项目是需要购买license的。

 

2.QooXdoo Tree Widget

QooXdoo Tree Widget

        QooXdoo Tree Widget是一款OOP风格的js树控件,它支持自由扩展树控件的样式,比如做成跟文件系统一样的风格,还支持动态添加子节点、键盘导航。

 

3.jsTree

jstree

        jstree兼容多个浏览器,它有诸多跟extjs TreePanels一样的有点,不过由于是基于Jquery的插件,所以代码风格就不是OOP。

 

4.TreeView

TreeView

        TreeView 是基于Jquery的轻量性、可扩展性强的树控件,它可以把ul列表转变成可以折叠伸缩的树,支持基于配置存储和cookie的树结构保存策略,树控件的基础代码比较轻量很适合在集成到各种项目。

 

5.Destroydrop

Destroydrop

        跟4功能比较类似,风格更接近xp文件系统,构造起来非常方便。

 

6.jQuery File Tree

.jQuery File Tree

        这是一款可配置的、ajax方式读取的Jquery文件浏览插件,大概用一行代码你就可以构造一颗树,它支持的服务端语言包括:PHP, ASP, ASP.NET, JSP, and Lasso,(它直接输出HTML,而jsTree和Extjs分别是通过json和xml来构建树)。

 

7.jQuery Simple Tree

jQuery Simple Tree

        jQuery SimpleTree是用来展示树形结构的可拖放插件,简介美观但是代码比较晦涩所以扩展可能比较难。

 

8.DHTML TreeView

DHTML TreeView

        又一个轻量级树控件。

 

9.Graphic JavaScript Tree with Layout

Graphic JavaScript Tree with Layout

        实现了J.Q.WalkerII(译者注:一种节点定位算法)一款js树控件。

10、Fly mini Tree1.0 js 树控件


总结

        构建树控件的比较理想的一种方法是用ul、li这种简单的标签组合来实现,但是你如果想实现复杂一点的比如要节点可编辑、可拖动、可更换风格等等我想ExtJS是最好的选择了。

 

文章来源:http://www.hxstrive.com/article/71.htm

 

 

分享到:
评论

相关推荐

    javascript 日期时间控件

    JavaScript 日期时间控件是一种在Web应用程序中用于用户交互式选择日期和时间的组件。它通常以日历或时钟的图形用户界面呈现,提供了一种直观且易于使用的交互方式,使得用户能够方便地输入或选择日期和时间值。在这...

    javascript 树形控件

    这种控件在各种应用场景中非常常见,例如文件目录浏览、组织结构展示、菜单系统等。 在JavaScript中实现树形控件,通常会涉及以下几个关键知识点: 1. **HTML结构**:首先,需要创建一个基本的HTML结构来承载树形...

    flash和javascript统计图控件

    在IT领域,尤其是在网页开发中,视觉数据呈现是至关重要的,而"Flash和JavaScript统计图控件"就提供了这样的功能。这两个技术都是用于创建交互式和动态用户体验的强大工具。 首先,让我们来了解一下**Flash**。...

    JavaScript经典日期控件

    JavaScript经典日期控件,如标题所述,是一种基于JavaScript编写的用于网页交互的日期选择组件,它使得用户在网页上能够方便地选取日期。这个控件的版本为My97DatePicker3.0.1,通常这类控件会提供丰富的功能和良好...

    javascript控件

    JavaScript控件是网页开发中常用的一种元素,它们用于增强用户界面的交互性和功能。JavaScript是一种轻量级的脚本语言,常被嵌入HTML页面中,以实现动态内容的生成和用户交互。在这个主题中,我们将深入探讨...

    js(javascript) 日期控件

    在网页中,JS可以极大地增强用户交互性,其中日期控件是常见的一种功能,用于帮助用户方便地选择日期,常用于日历插件、表单验证或时间相关的功能。下面将详细讨论JS日期控件的相关知识点。 1. **内置Date对象**:...

    javascript 经典tab控件

    在本主题中,我们关注的是"javascript 经典tab控件",这是一种常见的网页组件,用于组织和展示多块内容,让用户能够通过点击不同的标签来切换显示的内容。这种控件在许多网站和应用程序中都有应用,如设置页面、产品...

    6种JavaScript日历控件

    JavaScript日历控件是网页开发中常用的一种交互元素,它为用户提供了一个直观的方式来选择日期,常见于表单、事件管理或在线预订系统等场景。在本文中,我们将深入探讨六种不同的JavaScript日历控件,了解它们的特点...

    javascript时间选择控件

    JavaScript时间选择控件是一种在网页上提供用户交互式时间选择功能的组件,通常用于收集用户的日期和时间输入,如在填写表单时选择生日。这种控件通过CSS(层叠样式表)和JavaScript来实现,使得用户界面既美观又...

    javascript时间控件

    JavaScript时间控件是一种在网页上实现用户交互式时间选择功能的工具,通常用于表单输入或者日历插件等场景。这种控件允许用户通过图形界面来选择或输入时间,而不是传统的文本输入框,提高了用户体验和数据准确性。...

    Javascript 操作select控件大全

    Javascript 操作select控件大全(新增、修改、删除、选中、清空、判断存在等

    JavaScript日历控件 六种日历

    JavaScript日历控件是网页开发中常用的一种交互元素,它能帮助用户方便地选择日期,常见于表单输入、事件安排或时间相关的功能。在给定的资源中,包含了六种不同样式的JavaScript日历,这些日历可能具有不同的设计...

    几个经典JavaScript控件下载

    在这个“几个经典JavaScript控件下载”的压缩包中,包含了几个实用的JavaScript组件,这些组件可以帮助开发者创建更加交互性和用户友好的网页。 1. **表格格式的树示例**: 树形结构在数据展示中非常常见,例如...

    两个javascript的滑动杆控件

    在JavaScript的世界里,滑动杆(Slider)控件是一种常见的用户界面元素,它允许用户通过拖动一个可移动的柄来选择一个值或范围。在本主题中,我们将深入探讨两个JavaScript滑动杆控件,它们可以提升网页的交互性和...

    javascript日历输入控件

    JavaScript日历输入控件是一种常见的前端交互元素,用于在网页上提供用户友好的日期选择功能。这个控件通常被嵌入到ASP.NET页面中,通过点击按钮或文本框触发一个弹出的日历视图,允许用户直观地选择日期,而不是...

    javascript日期选择控件

    总之,"Calendar"是一款适用于JavaScript开发的日期选择控件,它的易用性和灵活性使其成为网页中常见的时间输入解决方案。掌握其用法和API,结合JavaScript的日期处理知识,能帮助开发者创建更丰富的用户界面。

    JavaScript脚本 日历控件

    JavaScript脚本日历控件是一种常见的前端交互元素,主要用于网页上的日期选择,为用户提供直观、易用的日历界面。在IE5.0及以上版本的浏览器中,这种控件可以正常运行,提供良好的兼容性,满足大部分网站的需求。...

    javascript控件开发之继承关系

    在这个主题中,“javascript控件开发之继承关系”主要探讨的是如何利用JavaScript的面向对象特性来构建和组织控件的层次结构,以及如何通过继承来实现代码的复用和模块化。 在JavaScript中,继承是基于原型...

    javascript 日期控件

    JavaScript 日期控件是网页开发中常用的一种交互元素,它允许用户在网页上方便地选择日期,常用于表单填写、日程安排等场景。在本案例中,我们有两个文件:`date.html` 和 `setday.js`。前者是HTML页面,后者是...

    Javascript日历空间控件

    JavaScript日历空间控件是一种基于Web的交互式组件,它允许用户在网页上方便地查看和选择日期。这种控件通常由JavaScript编程语言编写,利用HTML结构和CSS样式定义其外观,同时可能结合其他库如Bootstrap来增强用户...

Global site tag (gtag.js) - Google Analytics