目录树的数据库设计、java后台读取,以及前台javascript的显示
来源:互联网 发布:php中单双引号的区别 编辑:程序博客网 时间:2024/06/10 14:03
—–整理自凋落学长的笔记
我们网站肯定经常用到目录树
树在java web项目中的应用 ,主要是用来存储目录。
即这种:
这个 应该是从数据库查出来的 而不是写死在页面上的
如果每一个目录下 都可以有0-n个目录 是无限级别的 是存储在数据库中的 可维护的
1.数据库结构设计
那么 树形结构如何在关系数据库中存储中呢?
一对多 那种存储子目录吗?
这不行 ,因为是无限级别的 ,一对多只能两级。那如何存储不确定的分支数量 和不确定的分支级数。
简单的来说 ,表结构是这样的:
有一个根节点 父级id是 0
剩下的所有节点 全部具有父节点 主键自增就好了 ,父级id是该级别的上一级
url
即绝对路径 指从根节点到自己这里的所有经过的节点名称 中间用符号隔开
那么到这里大家可能想怎么查找? 我们可以在java后台中,查出list 然后再组合
2.java树结构
那么java怎么操作这个玩意儿?
java有List 有Map 有Set
但是没有tree
所以我们要自定义一个对象
我们这里可以叫menu对象
这四个属性确实和 数据库中的四个列
一一对应了。
但是我们如果仅仅是用List
所以接着写
每一个Menu对象 有 额外的两个属性。
父节点的实体对象 和子节点的Menu对象集合
于是 这就是一个 有父节点 有子节点 的对象
2.2 List《Menu》 转化成Menu root
我们需要用java代码把 parentMenu对象和 set赋值
至于 set基本上就简单了。大概就是
树的宽度遍历方法
先通过遍历List
大概就是这样了。
我们就可以得到一个Menu对象
它就是整个菜单
技巧:url
为什么要存储绝对路径
你可以用符号分割 大概这样:
url.split(“/”).length = ?
通过这个长度就可以得到 这是第几级目录
最后从数据库中查出来的Menu对象集合 通过这一整个大保健之后
就变成了一个Menu对象
3. 页面展示树
通常我们是把每个目录包含的连接什么的做成 文章开头那样目录树
通过一些js的tree.js这种函数库
这里我们为了方便用一个 列表来大概显示出来这些目录
<ul></ul>
这样大家先看着 。然后自己改进
我们在上一步中 直接把 Menu对象转化为
JSON格式
然后在页面中使用javascript代码解析 json字符串
也是 那个递归加循环的方法
然后通过append生成新的菜单列表
<%@taglib prefix="s" uri="/struts-tags" %><HTML><HEAD> <script src="js/jquery-1.8.3.js" type="text/javascript"></script></HEAD><BODY id="0"> <a href="#" onclick="show('<s:property value="json"/>')">啊啊</a><script type="text/javascript">function show(jsonstr){ alert(jsonstr); var m = eval("("+jsonstr+")"); parseJson(m);} function parseJson(json){ $("#" + json.parentID).append("<ul id=" + json.ID + ">" + json.name + "</ul>"); if(json.menuSet.length>0){ $.each(json.menuSet,function(){ parseJson(this); }) }else{ return; } }</script></BODY></HTML>
没有注释 应该不用写了吧。。。很简单的
然后看运行图
嗯 。大功告成
- 目录树的数据库设计、java后台读取,以及前台javascript的显示
- 生成静态页的 后台读取数据库,前台选中
- TYPO3后台RTEdl和d以及前台显示的问题
- Javascript的前台与后台
- 目录【Java分页(前台+后台)】
- IoC 前台显示后台输入的内容
- 后台管理前台要显示的字段
- Flex从后台读取数据前台显示为层次的树形结构
- 一个文件系统的后台及前台设计
- struts2前台与后台参数的交互,jsp到java,java到jsp,java到javascript
- ThinkPHP 读取后台的数据库
- 强大的Java前台后台开发工具
- ajax中如何读取前台传到后台的xml
- 前台读取后台生成的验证码内容
- 前台是怎么样去从后台读取到的数据
- Ajax前台请求 以及 后台 Java 处理 (包含undefined的问题)
- 将后台数据读取到前台的EXCEL文件中去,用javascript实现.(发一个原创)
- easyui,以及easyui的样式,后台输出到前台问题
- 《王者荣耀》手游感想
- 个人记录-LeetCode 53. Maximum Subarray
- 04-树4 是否同一棵二叉搜索树 (25分)
- android应用层操作底层硬件
- SQL函数汇总【精选篇】
- 目录树的数据库设计、java后台读取,以及前台javascript的显示
- 企业项目权限管理设计思路详解
- java与C++的内联函数
- Ubuntu16.04完全卸载Mysql 5.7
- Numpy与统计学
- UE4中实现描边效果
- jQuery筛选--查找,串联
- caffe,gpu ID号使用方法
- 替换jqgrid 分页小箭头样式