活是真正重要的东西,从容乐观的心态尤其重要
2009-06-13 10:30
274 查看
最近在写一个文件分享的程序,突然想能不能做一个目录树浏览的功能,但是又不想话太多的时间。想到已经把目录树用XML输出用于资源互联,就想试一下用XSLT显示一个这样的目录树。
参考资料:
http://www.west263.com/www/info/22688-1.htm http://www.w3school.com.cn/xsl/index.asp
XML文件的格式:
XSLT文件:
tree.js
tree.css
以前几乎没怎么用过XML做啥,觉得笨重,看到那些XML格式的配置文件也觉得不可思议,即使只有少量配置变量,我还需要用一长串的标签将其包括起来。这次用了感觉XML挺适合用来处理树状的内容。
参考资料:
http://www.west263.com/www/info/22688-1.htm http://www.w3school.com.cn/xsl/index.asp
XML文件的格式:
<EnterPoint startPath="/" Version="1.0"> <File name="软件" size="16384" lastModified="1307619056218" type="FILE" isDir="true"> <File name="Linux" size="4096" lastModified="1303369207691" type="FILE" isDir="true"> <File name="apache-tomcat-7.0.5.tar.gz" size="7130543" lastModified="1291110060000" type="FILE" isDir="false"/> <File name="dia-0.96.1.tar.bz2" size="4445553" lastModified="1175138668000" type="FILE" isDir="false"/> <File name="eclipse-jee-helios-SR2-linux-gtk.tar.gz" size="215060891" lastModified="1298523600000" type="FILE" isDir="false"/> <File name="google-earth-stable_current_i386.rpm" size="31788040" lastModified="1292432400000" type="FILE" isDir="false"/> <File name="jdk-6u22-linux-i586.bin" size="83761756" lastModified="1287562990000" type="FILE" isDir="false"/> <File name="Monospace.ttf" size="187953" lastModified="1291364936000" type="FILE" isDir="false"/> <File name="myeclipse-9.0M1-linux-gtk-x86.tgz" size="843288985" lastModified="1290607504000" type="FILE" isDir="false"/> <File name="netbeans-6.9.1-ml-linux.sh" size="278520832" lastModified="1291026576000" type="FILE" isDir="false"/> <File name="PPStream.rpm" size="1488923" lastModified="1291961422000" type="FILE" isDir="false"/> </File> </File> </EnterPoint>
XSLT文件:
<?xml version="1.0"?> <xsl:stylesheet version="2.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="EnterPoint"> <html> <head> <title>目录树</title> <script type="text/javascript" src="js/jquery-1.3.1.min.js"></script> <script type="text/javascript" src="js/tree.js"></script> <link rel="stylesheet" href="css/tree.css" type="text/css" /> </head> <body> <ul class="tree"> <xsl:apply-templates select="File"> <xsl:with-param name="path" select="'files/'"></xsl:with-param> </xsl:apply-templates> </ul> </body> </html> </xsl:template> <xsl:template match="File"> <xsl:param name="path"></xsl:param> <xsl:if test="@isDir='true'"> <li><span class="dir"><xsl:value-of select="@name"></xsl:value-of></span> <ul> <xsl:apply-templates select="child::File"> <xsl:with-param name="path" select="concat($path,@name,'/')"></xsl:with-param> </xsl:apply-templates> </ul> </li> </xsl:if> <xsl:if test="@isDir='false'"> <li><span class="file"> <a href="{concat($path,@name)}" target="_blank"> <xsl:value-of select="@name"></xsl:value-of> </a> </span> </li> </xsl:if> </xsl:template> </xsl:stylesheet>
tree.js
var tree = { buildTree : function() { $('.tree li').each(function() { if ($(this).is(':has(ul)')) $(this).addClass('collapse'); if ($(this).next().is('li') || $(this).next().is('ul')) $(this).css({ borderLeft : 'dashed 1px #dedede' }); }); $('li.collapse>span').click( function() { $(this).next('ul').slideToggle( 'fast', function() { if ($(this).parent().hasClass('collapse')) $(this).parent().removeClass('collapse') .addClass('expand'); else $(this).parent().removeClass('expand') .addClass('collapse'); }); }); $('span.func').css({ 'cursor' : 'pointer' }).hover(function() { $(this).css({ 'color' : '#3de', 'text-decoration' : 'underline' }); }, function() { $(this).css({ 'color' : '#000', 'text-decoration' : 'none' }); }).click(function() { $.fn.jerichoTab.addTab({ tabFirer : $(this), title : $(this).text(), closeable : true, iconImg : $(this).attr('iconImg'), data : { dataType : $(this).attr('dataType'), dataLink : $(this).attr('dataLink') } }).showLoader().loadData(); }); } }; $().ready(function() { tree.buildTree(); contractAll(); }); function contractAll() { $('li.collapse>span').each(function() { $(this).next('ul').slideToggle('fast', function() { if ($(this).parent().hasClass('collapse')) $(this).parent().removeClass('collapse').addClass('expand'); else $(this).parent().removeClass('expand').addClass('collapse'); }); }); }
tree.css
.tree { margin: 0; padding: 0; } .tree ul,.tree li { list-style-type: none; margin: 0; padding: 0; } .tree li { padding-left: 14px; line-height: 18px; } .tree span.modules { cursor: pointer; color: #783432; } .tree li.collapse { background: url(../img/collapse.gif) no-repeat left 4px; } .tree li.expand { background: url(../img/expand.gif) no-repeat left 4px; }
以前几乎没怎么用过XML做啥,觉得笨重,看到那些XML格式的配置文件也觉得不可思议,即使只有少量配置变量,我还需要用一长串的标签将其包括起来。这次用了感觉XML挺适合用来处理树状的内容。
相关文章推荐
- 活是真正重要的东西,从容乐观的心态尤其重要
- 在大学,学会这些东西比上课重要得多…
- 重要东西备记
- 马云力荐:把时间分配在真正重要和真正有趣的事情上
- 【一个男人娶了四个妻子。临终时却。。。【这个故事有点深度。其实人人都是这样。。但现实中我们往往忽略真正意义上的东西】
- 从真正的程序员中学到的东西。
- 不会再有的心动(为了怀念我真正从心里喜欢的第一个女孩,此东东仅代表我那时的心态和态度~~~~!!!)
- 食品安全越来越重要,尤其针对婴幼儿
- 人生重要的东西
- 前不久,微软发布了其网络硬盘的正式版本:Windows Live Skydrive。它面向公共用户免费提供5G空间,最大单个文件支持到50M,还提供个人文件夹。微软的东西,当然会让人更放心一些,而且最重要的是它提供永久存储服务,还提供超链接!
- 编程新手我觉得需要掌握的五个重要东西
- 上个月的重要东西
- 面向对象最重要的是“抽象”,三层最重要的也是“抽象”,没有抽象就不是真正的面向对象、三层。
- 真正在乎的东西
- 作为一个男人,尤其作为一个真正的爷们,应该做好下列小事:
- 客户真正想要的12件东西
- 十九种不良生活习惯(最后一条尤其重要)
- 需求分析和进度预测特别重要—以前学校里没见过的东西
- 心态好才是最重要的
- Hibernate学习笔记总结(二)——Hibernate 3.x 关联映射(重要)Lazy策略 悲观锁与乐观锁