`

使用dTree构建树形菜单

阅读更多
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>

<head>
<title>Destroydrop » Javascripts » Tree</title>

<link rel="StyleSheet" href="dtree.css" type="text/css" />
<script type="text/javascript" src="dtree.js"></script>

</head>

<body>

<h1><a href="/">dTree</a> » <a href="/javascripts/">使用示例</a> » </h1>

<h2>示例</h2>

<div class="dtree">

<p><a href="javascript: xx.openAll();">全部打开</a> | <a href="javascript: xx.closeAll();">全部关闭</a></p>

<script type="text/javascript">
   <!--

   xx = new dTree('xx');

   xx.add(0,-1,'所有网站');
   xx.add(1,0,'娱乐类','example01.html');
   xx.add(2,0,'搜索类','example01.html');
   xx.add(3,1,'聊天类','example01.html');
   xx.add(4,0,'音乐','example01.html');
   xx.add(5,3,'腾讯','example01.html');
   xx.add(6,5,'QQ','example01.html');
   xx.add(13,5,'TM','example01.html');
   xx.add(7,0,'视频','example01.html');
   xx.add(8,1,'56视频','example01.html');
   xx.add(9,0,'图片库','example01.html','Pictures I\'ve taken over the years','','','img/imgfolder.gif');
   xx.add(10,9,'帅哥','example01.html','Pictures of Gullfoss and Geysir');
   xx.add(11,9,'美女','example01.html');
   xx.add(12,0,'小说','example01.html','','','img/trash.gif');

   document.write(xx);

   //-->
</script>

</div>

<p><a href="mailto:drop@destroydrop.com">©2002-2003 Geir Landrö</a></p>
<div style="width:350px;height:300px;overflow: auto;color:blue;border: 1px groove green;float:left">
参数说明:</br>
<p>
   add(id,pid,name,url,title,target,icon,iconOpen,open)
   <br>
   id:唯一标识<br>
   pid:父id,如果是要元素,必须为-1<br>
   name:名字<br>
   url:此节点对应的url<br>
   title:鼠标放上去显示的内容<br>
   target:与<a/>中的相同<br>
   icon:节点图标<br>
   iconOpen:节点被打开时的图标<br>
   open:是否打开true/false<br>
</p>
</div>
</body>

</html>

 

效果如下:


分享到:
评论

相关推荐

    jsp树形菜单 dtree tree 树形菜单

    在这个“jsp树形菜单 dtree tree 树形菜单”的项目中,我们将探讨如何利用JSP、dtree库以及可能的Struts框架来创建一个动态的树形菜单。 首先,JSP(JavaServer Pages)是一种基于Java的技术,用于创建动态Web内容...

    DTree动态树形菜单

    DTree动态树形菜单是一种常见的用户界面元素,广泛应用于数据层级结构的展示,例如文件系统、组织架构或者网站导航。这个完整的项目例子提供了一个全面的解决方案,帮助开发者理解和实现这样的功能。 首先,我们要...

    dtree js树形菜单 你懂的

    - **JSON数据源**:可以从服务器获取JSON数据,动态构建树形菜单,实现动态加载。 ### 五、实际应用示例 `dtree`常用于: 1. **网站导航**:构建层次清晰的导航栏,使用户更容易找到目标页面。 2. **文件管理系统...

    dTree 无限级树形菜单

    《dTree:构建无限级树形菜单的利器》 在前端开发中,树形菜单是一种常见的数据展示形式,尤其在管理界面或者数据层级结构复杂的场景下,它能清晰地展示层次关系,便于用户操作和理解。dTree就是这样一款用于创建...

    dTree 生成无限级树形菜单

    `dTree` 是一个JavaScript对象,专用于构建无限级的树形菜单。本篇文章将深入探讨如何利用`dTree`来生成动态的树形菜单,并结合后台Action中的List数据进行操作。 首先,我们需要理解`dTree`的基本概念。`dTree`是...

    使用DTREE构建树

    本文将深入探讨如何使用DTREE构建树菜单,包括动态树和静态树的构建方法。 首先,让我们理解决策树的基本概念。决策树是由节点和边构成的图形结构,其中每个内部节点代表一个特征或属性测试,每个分支代表一个测试...

    dtree写的动态树形菜单

    首先,dtree是一个JavaScript库,专为构建可交互的、动态的树形菜单设计。它允许开发者根据用户的权限动态生成菜单结构,这在权限控制严格的系统中非常有用。例如,在一个企业管理后台,不同角色的用户可能只能看到...

    实现dtree树形菜单的Demo

    通过以上介绍,我们了解到dtree库如何用于构建树形菜单。这个Demo可能包含了如何初始化树形菜单,添加节点,设置节点属性,以及处理用户交互的基本步骤。通过深入学习dtree的文档和实践,可以创建更复杂、功能更丰富...

    dtree+jquery 动态实现无限树形菜单 (包括增删改查)

    本主题聚焦于使用dtree与jQuery库动态实现无限层级的树形菜单,并涵盖增删改查的基本功能。dtree是一款基于jQuery的插件,它提供了丰富的API和灵活的配置选项,使得在网页上创建交互式树形菜单变得简单易行。 首先...

    dtree树形菜单范例.rar

    【dtree树形菜单范例】是一个用于构建多级子节点树形菜单的插件,主要应用于网页设计,尤其适用于网站后台和用户中心的导航。这个插件以其易用性和知名度,成为许多开发者构建层级结构清晰、交互友好的菜单系统的...

    Dtree动态树菜单

    Dtree通常是一个JavaScript库或者框架的一部分,用于构建可扩展的、交互式的树形菜单。这样的菜单在网页应用中特别有用,特别是那些需要管理层次结构数据的系统,如文件管理系统、组织结构图、权限分配等。Dtree...

    树形菜单dtree

    在IT领域,树形菜单(dtree)是一种常见的用户界面元素,它以树状结构来组织数据,便于用户浏览和操作。这种结构模仿了自然界中的树,其中根节点位于顶部,子节点则按照层次关系向下扩展。在本篇文章中,我们将深入...

    dtree树形菜单的简单使用举例

    总结,`dtree`是一个强大的工具,用于构建和管理树形菜单。通过理解其基本使用步骤,配置数据,以及掌握交互和扩展功能,你可以有效地利用`dtree`在你的项目中创建出富有互动性的、层次分明的导航结构。记得在实际...

    dtree,ssh,树形菜单,框架,mysql

    在本话题中,我们将重点讨论`dtree`、`SSH`、树形菜单在框架中的应用以及与`MySQL`数据库的结合。 首先,`dtree`是一个用于创建动态树形菜单的JavaScript库,它可以用来构建网页中的交互式导航系统。`dtree`提供了...

    Dtree树形结构菜单

    **Dtree:构建优雅的树形结构菜单** 在IT领域,树形结构是一种常见的数据组织方式,它模拟了自然界中的树状层次关系,用于表示具有层级关系的数据。Dtree是专门用于创建美观、多级的树形结构导航菜单的工具,广泛...

    封装的dTree.js文件动态创建树形菜单

    dTree.js是一个轻量级的JavaScript库,专门用于构建交互式的树形菜单。它提供了丰富的API和配置选项,使得开发者能够方便地自定义树形菜单的样式、行为以及数据来源。以下我们将逐步介绍如何在项目中使用dTree.js。 ...

    js树形菜单dtree

    2. **创建数据结构**:dtree需要一个数据结构来构建树形菜单,这个结构通常是JSON格式。例如: ```json var data = [ { text: "父节点1", children: [ { text: "子节点1-1" }, { text: "子节点1-2" } ] }, ...

    dtree原版+经典树形菜单+API

    通过熟练掌握这些API,开发者可以自如地构建和控制dtree树形菜单,满足项目中的各种需求。同时,dtree还支持自定义扩展,允许开发者根据项目特性进行二次开发,增强了其灵活性和实用性。 总之,dtree作为一款强大的...

    jquery dtree 实例 动态实现无限树形菜单(增删改查)

    这个实例着重展示了如何利用jQuery dTree动态地构建一个无限层级的树形菜单,并实现基本的数据操作功能,包括添加、删除、修改和查询。下面我们将深入探讨这个主题。 首先,jQuery dTree是一个轻量级的插件,它基于...

    用dtree实现树形菜单 dtree使用说明

    【dtree实现树形菜单详解】 ...通过这种方式,dtree可以帮助开发者轻松地构建交互式的树形菜单,适用于网站导航、文件系统浏览等多种场景。结合自定义配置和方法,可以实现更多高级功能,满足不同项目需求。

Global site tag (gtag.js) - Google Analytics