123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104 |
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <title></title>
- <style type="text/css">
- html, body { width: 100%; height: 100%; margin: 0;padding: 0; }
- #left { width: 25%; border: 1px solid gray; float: left;}
- #right { width: 70%; border: 1px solid gray;float: left;}
- .jddiv{ margin: 5px; margin-left: 20px; width: 500px;}
- </style>
- <!--直接引用1473的js文件-->
- <script src="http://d.1473.cn/UJ.js" type="text/javascript"></script>
- <!--json类-->
- <script src="http://d.1473.cn/js/U.Json.js" type="text/javascript"></script>
- <script src="http://d.1473.cn/js/U.JsonData.js" type="text/javascript"></script>
- <script src="http://www.1473.cn/js/UC/U.MC.js" type="text/javascript"></script>
- <script type="text/javascript">
- var jd = _jdata; //json数据
- function init() { dgjson(jd, document.getElementById("left")); }
- //遍历输出json所有数据
- function dgjson(jd, p) {
- if (jd.TNode.length > 0) {
- var i; for (i = 0; i < jd.TNode.length; i++) {
- if (jd.TNode[i].Type != "file") {
- var t = $$("div", { "className": "jddiv", "innerHTML": "+" + jd.TNode[i].Name }, p); dgjson(jd.TNode[i], t);
- }
- else { var t = $$("div", { "className": "jddiv", "innerHTML": "" + jd.TNode[i].Name }, p); }
- }
- }
- }
- var aa = new U.Json(jd);
- function findone() { disresult(aa.FindOne); }
- function FindParent() { disresult(aa.Parent); }
- function disresult(CB) {
- var s = document.getElementById("jsoninput").value;
- var _r = CB.apply(aa, [{ "Name": s}]); //解决this指针的指向问题。没有很好的解决,,初略方案
- document.getElementById("result_N").innerHTML = aa.ToString(_r);
- document.getElementById("result").style.display = "block";
- }
- function addChild() {
- var s = document.getElementById("jsoninput").value;
- var v = document.getElementById("addinput").value;
- var _r = CB.apply(aa, [{ "Name": s}]); //解决this指针的指向问题。没有很好的解决,,初略方案
- document.getElementById("result_N").innerHTML = aa.ToString(_r);
- document.getElementById("result").style.display = "block";
- }
- function DelMore() {
- //var _r = aa.DelMore({ "IsDelete": false }); //解决this指针的指向问题。没有很好的解决,,初略方案
- var _r = aa.DelMore({ "Deep": 3 }); //解决this指针的指向问题。没有很好的解决,,初略方案
- if (!_r) {alert(_r);}
- document.getElementById("result_N").innerHTML = aa.ToString(_r);
- document.getElementById("result").style.display = "block";
- }
- window.onload = init;
- </script>
- </head>
- <body>
- <div id="left">
- </div>
- <div id="right">
- <div>各种json操作</div>
- <div>输入内容:<input id="jsoninput" style="width: 400px;" value="" type="text" /></div>
- <!-------------------查找一个的功能-------------------------->
- <div> 1、查找某一个节点,返回该节点的所有数据 调用方式 UJson.findone(D,V),D为json树,V为待查找的json<input onclick="findone()" type="button" value="确定" /> </div>
- <div> 2、返回一个节点的所有孩子节点(注:同1),这个函数无需做,同第一个</div>
- <!---------------------修改功能------------------------------>
- <div> 3、修改某一个节点,这个函数无需做,前台直接修改即可</div>
- <div> 4、修改某一个json的多项值,比如用户信息,修改5个以上。则直接修改。</div>
- <!--查找父亲的功能-->
- <div> 5、找到某个节点的父亲节点。如未根目录,父亲节点为空 <input onclick="FindParent()" type="button" value="确定" /> </div>
- <div> 6、找到指定节点所在的数组,同上,找到父亲节点即可找到所在节点的数组,无需做。此功能经常需要</div>
- <div> 7、找到父亲节点所在的数组、同上,需要查找父亲节点的父亲节点。需要递归2次,此功能经常需要。</div>
- <!-- 添加功能 -->
- <div>前面一个div找到节点,这个input输入新插入的节点:<input id="addinput" style="width: 400px;" value="" type="text" /></div>
- <div> 8、在指定节点下面添加孩子结点,无需做,前台已经提供了这个功能 <input onclick="addChild()" type="button" value="确定" /> </div>
- <div> 9、给指定节点添加兄弟节点,无需做,先找到父亲节点,然后找父亲节点的孩子节点</div>
- <div> 10、树的合并,2颗树合并为一颗,此功能无需做,树已经有这个功能。</div>
- <!--删除功能-->
- <div>11、删除某一个节点,无需做,前台直接删除某一个节点,调用数组的remove函数,此函数已经修改了原型。。 </div>
- <div>12、删除拥有某一样属性的所有节点、例如在编程树中,有些元素标记了删除,则不选取这些节点出来。此函数比较复杂<input onclick="DelMore()" type="button" value="确定" /></div>
-
- <div>
- 11、清空数组。可以搜索一下清空数组的三个方案</div>
-
- </div>
- <div id="result" style="position: absolute; top: 100px; left: 300px; display: none;
- width: 400px; min-height: 600px; border: 10px solid gray; background-color: White;">
- <div style="width: 390px; height: 30px;">
- <div style="float: right; font-size: 20px; cursor: pointer;" onclick="this.parentNode.parentNode.style.display='none'">
- X</div>
- </div>
- <div id="result_N" style="width: 400px; min-height: 570px;">
- </div>
- </div>
- </body>
- </html>
|