写了个XML+Tree无穷树js版

2016-02-19 09:06 4 1 收藏

给自己一点时间接受自己,爱自己，趁着下午茶的时间来学习图老师推荐的写了个XML+Tree无穷树js版，过去的都会过去，迎接崭新的开始，释放更美好的自己。

【 tulaoshi.com - Web开发】

<head> <style type="text/css"> .select { width:80%; border:0px solid #bfbfbf; } .options { width:98%; border:0px solid #ff0000; } .tree { width:92%; border:0px solid #ff0000; } </style> </head> <body> <xml id="Login"> <?xml version="1.0" encoding="utf-8" ?> <Students name="98班级"> <Student name="王小平"> <Chinese id="語文"><Item id="单选题"><Score id="33"></Score><Score id="33"></Score><Score id="33"></Score></Item><Item id="多选题"><Score id="33"></Score> </Item><Item id="计算题"><Score id="33"></Score></Item><Item id="应用题"><Score id="33"></Score></Item><Item id="附加题"><Score id="33"></Score></Item> </Chinese> <Physics id="物理"></Physics> <English id="英語"></English> <Geography id="地理"></Geography> <Historical id="歷史"></Historical> </Student> <Student name="王小波"> <Chinese id="語文"><Item id="单选题"><Score id="33"></Score><Score id="33"></Score><Score id="33"></Score></Item><Item id="多选题"><Score id="33"></Score> </Item><Item id="计算题"><Score id="33"></Score></Item><Item id="应用题"><Score id="33"></Score></Item><Item id="附加题"><Score id="33"></Score></Item> </Chinese> <Physics id="物理"></Physics> <English id="英語"></English> <Geography id="地理"></Geography> <Historical id="歷史"></Historical> </Student> <Student name="劉瓊"> <Chinese id="語文"></Chinese> <Physics id="物理"></Physics> <English id="英語"></English> <Geography id="地理"></Geography> <Historical id="歷史"></Historical> </Student> <Student name="孟雲江"> <Chinese id="語文"></Chinese> <Physics id="物理"></Physics> <English id="英語"></English> <Geography id="地理"></Geography> <Historical id="歷史"></Historical> </Student> <Student name="余敬興"> <Chinese id="語文"></Chinese> <Physics id="物理"></Physics> <English id="英語"></English> <Geography id="地理"></Geography> <Historical id="歷史"></Historical> </Student> <Student name="金細愛"> <Chinese id="語文"></Chinese> <Physics id="物理"></Physics> <English id="英語"></English> <Geography id="地理"></Geography> <Historical id="歷史"></Historical> </Student> <Student name="羅必洪"> <Chinese id="語文"></Chinese> <Physics id="物理"></Physics> <English id="英語"></English> <Geography id="地理"></Geography> <Historical id="歷史"></Historical> </Student> <Student name="姜海平"> <Chinese id="語文"></Chinese> <Physics id="物理"></Physics> <English id="英語"></English> <Geography id="地理"></Geography> <Historical id="歷史"></Historical> </Student> <Student name="姚軍"> <Chinese id="語文"></Chinese> <Physics id="物理"></Physics> <English id="英語"></English> <Geography id="地理"></Geography> <Historical id="歷史"></Historical> </Student> <Student name="李海濤"> <Chinese id="語文"></Chinese> <Physics id="物理"></Physics> <English id="英語"></English> <Geography id="地理"></Geography> <Historical id="歷史"></Historical> </Student> <Student name="陳平"> <Chinese id="語文"></Chinese> <Physics id="物理"></Physics> <English id="英語"></English> <Geography id="地理"></Geography> <Historical id="歷史"></Historical> </Student> <Student name="胡光"> <Chinese id="語文"></Chinese> <Physics id="物理"></Physics> <English id="英語"></English> <Geography id="地理"></Geography> <Historical id="歷史"></Historical> </Student> </Students> </xml> <body>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

<head> <style type="text/css"> .select { width:80%; border:0px solid #bfbfbf; } .options { width:98%; border:0px solid #ff0000; } .tree { border:0x solid #ff0000; } .treeView { height:400px; width:300px; border:1x solid #ff0000; overflow:auto; } </style> </head> <body> <xml id="Login"> <?xml version="1.0" encoding="utf-8" ?> <Students name="98班级"> <Student name="王小平"> <Chinese id="語文"><Item id="单选题"><Score id="33"></Score><Score id="33"></Score><Score id="33"></Score></Item><Item id="多选题"><Score id="33"></Score> </Item><Item id="计算题"><Score id="33"></Score></Item><Item id="应用题"><Score id="33"></Score></Item><Item id="附加题"><Score id="33"></Score></Item> </Chinese> <Physics id="物理"></Physics> <English id="英語"></English> <Geography id="地理"></Geography> <Historical id="歷史"></Historical> </Student> <Student name="王小波"> <Chinese id="語文"><Item id="单选题"><Score id="33"></Score><Score id="33"></Score><Score id="33"></Score></Item><Item id="多选题"><Score id="33"></Score> </Item><Item id="计算题"><Score id="33"></Score></Item><Item id="应用题"><Score id="33"></Score></Item><Item id="附加题"><Score id="33"></Score></Item> </Chinese> <Physics id="物理"></Physics> <English id="英語"></English> <Geography id="地理"></Geography> <Historical id="歷史"></Historical> </Student> <Student name="劉瓊"> <Chinese id="語文"></Chinese> <Physics id="物理"></Physics> <English id="英語"></English> <Geography id="地理"></Geography> <Historical id="歷史"></Historical> </Student> <Student name="孟雲江"> <Chinese id="語文"></Chinese> <Physics id="物理"></Physics> <English id="英語"></English> <Geography id="地理"></Geography> <Historical id="歷史"></Historical> </Student> <Student name="余敬興"> <Chinese id="語文"></Chinese> <Physics id="物理"></Physics> <English id="英語"></English> <Geography id="地理"></Geography> <Historical id="歷史"></Historical> </Student> <Student name="金細愛"> <Chinese id="語文"></Chinese> <Physics id="物理"></Physics> <English id="英語"></English> <Geography id="地理"></Geography> <Historical id="歷史"></Historical> </Student> <Student name="羅必洪"> <Chinese id="語文"></Chinese> <Physics id="物理"></Physics> <English id="英語"></English> <Geography id="地理"></Geography> <Historical id="歷史"></Historical> </Student> <Student name="姜海平"> <Chinese id="語文"></Chinese> <Physics id="物理"></Physics> <English id="英語"></English> <Geography id="地理"></Geography> <Historical id="歷史"></Historical> </Student> <Student name="姚軍"> <Chinese id="語文"></Chinese> <Physics id="物理"></Physics> <English id="英語"></English> <Geography id="地理"></Geography> <Historical id="歷史"></Historical> </Student> <Student name="李海濤"> <Chinese id="語文"></Chinese> <Physics id="物理"></Physics> <English id="英語"></English> <Geography id="地理"></Geography> <Historical id="歷史"></Historical> </Student> <Student name="陳平"> <Chinese id="語文"></Chinese> <Physics id="物理"></Physics> <English id="英語"></English> <Geography id="地理"></Geography> <Historical id="歷史"></Historical> </Student> <Student name="胡光"> <Chinese id="語文"></Chinese> <Physics id="物理"></Physics> <English id="英語"></English> <Geography id="地理"></Geography> <Historical id="歷史"></Historical> </Student> </Students> </xml> <body>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

来源:https://www.tulaoshi.com/n/20160219/1589520.html

上一篇：通过Android trace文件分析死锁ANR实例过程
下一篇：用javascript实现画板的代码

看过《写了个XML+Tree无穷树js版》的人还看了以下文章更多>>

Tree Ctrl

标签：编程语言网络编程

树形控件TreeCtrl和下节要讲的列表控件 ListCtrl在系统中大量被使用，例如Windows资源管理器就是一个典型的例子。树形控件可以用于树形的结构，其中有一个根接点(Root)然后下面有许多子结点，而每个子结点上有允许有一个或多个或没有子结点。MFC中使用CTreeCtrl类来封装树形控件的各种操作。通过调用 BOOL Create( DWORD dwStyle, const RECT...

灵活调用xsl来解析xml文档(js异步)

标签： Web开发

1.新建一个vs2003的web工程,取名为XMLTest 2.将工程目录下的WebForm1.aspx中内容全部删除，只留下顶部的一条语句： %@ Page language="c#" Codebehind="WebForm1.aspx.cs" AutoEventWireup="false" Inherits="XMLTest.WebForm1" % 3.修改...

针对select写了一个通用的option输出函数

标签： ASP

function writeSlt(arrstr,arrstrValue,selectedstr) 'arrstr 要显示在option里面的值，arrstrValue option的实际值，selectedstr要选中的默认值 '将一个字串分割为数组，输出select的option，并选中selectedstr arrstr&arrstrValue长度要一致 arr=split(arrstr,",") arrValue=split(arrstrValue,",") j=0 do while j<=ubound(a...

XML卷之实战锦囊（5）：结构树图

标签： Web开发

动机：最初想起做二叉树是因为需要做一个公司结构图。以前的做法都是直接用图象软件画出来一个图片。很好看，但每次有变动后都需要重新画一个新的。另一方面，网页上对线条的显示、布局相当局限。根据动态生成的数据进行排版、定位都相当困难，而且在美观上也差强人意。做了各种尝试以后，决定用XML+XSL作数据运算；用VML来美化...

XML卷之实战锦囊(5)结构树图