操作JSON数据

操作标准JSON数据,递归实现如下:

String.prototype.startWith = function(compareStr) {
    return this.indexOf(compareStr) == 0;
}

// 生成以rootNode为根节点的树
function generateSubtree(rootNode, childrenJson) {
    for(var idx = 0; idx < childrenJson.length; ++idx) {
        var child = childrenJson[idx];
        // 子节点
        var childNode = {
            "name": child.name,
            "desc": child.desc,
            "dsp=": child.name.startWith("节点-1") ? "Y" : "N",
            "children": []
        };
        // 如果有孩子则生成其子树
        if (child.children != null && child.children != '[]') {
            generateSubtree(childNode, child.children);
        }

        // childNode子树作为rootNode的孩子
        rootNode.children.push(childNode);
    }
}

实例如下:

  1 <html>
  2 <head>
  3 <meta charset="utf-8" />
  4 <script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
  5 <script type="text/javascript">
  6     var stdJsonData = {
  7         "name": "根结点",
  8         "desc": "根结点描述",
  9         "children": [
 10             {
 11                 "name": "节点-1",
 12                 "desc": "节点-1-描述",
 13                 "children": [
 14                     {
 15                         "name": "节点-1-1",
 16                         "desc": "节点-1-1描述",
 17                         "children": [
 18                             {
 19                                 "name": "节点-1-1-1",
 20                                 "desc": "节点-1-1-1描述",
 21                                 "children": [
 22                                     {
 23                                         "name": "节点-1-1-1-1",
 24                                         "desc": "节点-1-1-1-1描述",
 25                                         "children": [
 26                                             {
 27                                                 "name": "节点-1-1-1-1-1",
 28                                                 "desc": "节点-1-1-1-1-1描述"
 29                                             },
 30                                             {
 31                                                 "name": "节点-1-1-1-1-2",
 32                                                 "desc": "节点-1-1-1-1-2描述"
 33                                             },
 34                                             {
 35                                                 "name": "节点-1-1-1-1-3",
 36                                                 "desc": "节点-1-1-1-1-3描述",
 37                                                 "children": [
 38                                                     {
 39                                                         "name": "节点-1-1-1-1-3-1",
 40                                                         "desc": "节点-1-1-1-1-3-1描述"
 41                                                     },
 42                                                     {
 43                                                         "name": "节点-1-1-1-1-3-2",
 44                                                         "desc": "节点-1-1-1-1-3-2描述"
 45                                                     },
 46                                                     {
 47                                                         "name": "节点-1-1-1-1-3-3",
 48                                                         "desc": "节点-1-1-1-1-3-3描述"
 49                                                     }
 50                                                 ]
 51                                             }
 52                                         ]
 53                                     },
 54                                     {
 55                                         "name": "节点-1-1-1-2",
 56                                         "desc": "节点-1-1-1-2描述",
 57                                         "children": [
 58                                             {
 59                                                 "name": "节点-1-1-1-2-1",
 60                                                 "desc": "节点-1-1-1-2-1描述"
 61                                             },
 62                                             {
 63                                                 "name": "节点-1-1-1-2-2",
 64                                                 "desc": "节点-1-1-1-2-2描述"
 65                                             },
 66                                             {
 67                                                 "name": "节点-1-1-1-2-3",
 68                                                 "desc": "节点-1-1-1-2-3描述"
 69                                             }
 70                                         ]
 71                                     },
 72                                     {
 73                                         "name": "节点-1-1-1-3",
 74                                         "desc": "节点-1-1-1-3描述"
 75                                     },
 76                                     {
 77                                         "name": "节点-1-1-1-4",
 78                                         "desc": "节点-1-1-1-4描述"
 79                                     }
 80                                 ]
 81                             },
 82                             {
 83                                 "name": "节点-1-1-2",
 84                                 "desc": "节点-1-1-2描述"
 85                             },
 86                             {
 87                                 "name": "节点-1-1-3",
 88                                 "desc": "节点-1-1-3描述",
 89                                 "children": [
 90                                     {
 91                                         "name": "节点-1-1-3-1",
 92                                         "desc": "节点-1-1-3-1描述"
 93                                     },
 94                                     {
 95                                         "name": "节点-1-1-3-2",
 96                                         "desc": "节点-1-1-3-2描述"
 97                                     },
 98                                     {
 99                                         "name": "节点-1-1-3-3",
100                                         "desc": "节点-1-1-3-3描述"
101                                     }
102                                 ]
103                             }
104                         ]
105                     },
106                     {
107                         "name": "节点-1-2",
108                         "desc": "节点-1-2描述"
109                     },
110                     {
111                         "name": "节点-1-3",
112                         "desc": "节点-1-3描述"
113                     }
114                 ]
115             },
116             {
117                 "name": "节点-2",
118                 "desc": "节点-2-描述",
119                 "children": [
120                     {
121                         "name": "节点-2-1",
122                         "desc": "节点-2-1描述",
123                         "children": [
124                             {
125                                 "name": "节点-2-1-1",
126                                 "desc": "节点-2-1-1描述",
127                                 "children": [
128                                     {
129                                         "name": "节点-2-1-1-1",
130                                         "desc": "节点-2-1-1-1描述",
131                                         "children": [
132                                             {
133                                                 "name": "节点-2-1-1-1-1",
134                                                 "desc": "节点-2-1-1-1-1描述"
135                                             },
136                                             {
137                                                 "name": "节点-2-1-1-1-2",
138                                                 "desc": "节点-2-1-1-1-2描述"
139                                             },
140                                             {
141                                                 "name": "节点-2-1-1-1-3",
142                                                 "desc": "节点-2-1-1-1-3描述"
143                                             }
144                                         ]
145                                     },
146                                     {
147                                         "name": "节点-2-1-1-2",
148                                         "desc": "节点-2-1-1-2描述"
149                                     },
150                                     {
151                                         "name": "节点-2-1-1-3",
152                                         "desc": "节点-2-1-1-3描述"
153                                     }
154                                 ]
155                             },
156                             {
157                                 "name": "节点-2-1-2",
158                                 "desc": "节点-2-1-2描述"
159                             },
160                             {
161                                 "name": "节点-2-1-2",
162                                 "desc": "节点-2-1-2描述"
163                             }
164                         ]
165                     },
166                     {
167                         "name": "节点-2-2",
168                         "desc": "节点-2-2描述",
169                         "children": [
170                             {
171                                 "name": "节点-2-2-1",
172                                 "desc": "节点-2-2-1描述"
173                             },
174                             {
175                                 "name": "节点-2-2-2",
176                                 "desc": "节点-2-2-2描述"
177                             },
178                             {
179                                 "name": "节点-2-2-3",
180                                 "desc": "节点-2-2-3描述"
181                             }
182                         ]
183                     }
184                 ]
185             },
186             {
187                 "name": "节点-3",
188                 "desc": "节点-3-描述",
189                 "children": [
190                     {
191                         "name": "节点-3-1",
192                         "desc": "节点-3-1描述",
193                         "children": [
194                             {
195                                 "name": "节点-3-1-1",
196                                 "desc": "节点-3-1-1描述",
197                                 "children": [
198                                     {
199                                         "name": "节点-3-1-1-1",
200                                         "desc": "节点-3-1-1-1描述",
201                                         "children": [
202                                             {
203                                                 "name": "节点-3-1-1-1-1",
204                                                 "desc": "节点-3-1-1-1-1描述"
205                                             },
206                                             {
207                                                 "name": "节点-3-1-1-1-2",
208                                                 "desc": "节点-3-1-1-1-2描述"
209                                             }
210                                         ]
211                                     },
212                                     {
213                                         "name": "节点-3-1-1-2",
214                                         "desc": "节点-3-1-1-2描述"
215                                     }
216                                 ]
217                             },
218                             {
219                                 "name": "节点-3-1-2",
220                                 "desc": "节点-3-1-2描述"
221                             },
222                             {
223                                 "name": "节点-3-1-3",
224                                 "desc": "节点-3-1-3描述"
225                             }
226                         ]
227                     },
228                     {
229                         "name": "节点-3-2",
230                         "desc": "节点-3-2描述"
231                     }
232                 ]
233             }
234         ]
235     };
236 
237     String.prototype.startWith = function(compareStr) {
238         return this.indexOf(compareStr) == 0;
239     }
240 
241     function generateTreeModel(stdJson) {
242         // 根据JSON数据格式才有此实现,否则可以精简一半代码!
243         // {[], [], []},即stdJson本身也是一个节点。
244         if (stdJson != null && stdJson != '[]') {
245             var rootNode = {
246                 "name": stdJson.name,
247                 "desc": stdJson.desc,
248                 "children": []
249             };
250 
251             for (var idx = 0; idx < stdJson.children.length; ++idx) {
252                 var child = stdJson.children[idx];
253                 var childNode = {
254                     "name": child.name,
255                     "desc": child.desc,
256                     "dsp=": child.name.startWith("节点-1") ? "Y" : "N",
257                     "children": []
258                 };
259                 if(child.children != null && child.children != '[]') {
260                     generateSubtree(childNode, child.children);
261                 }
262 
263                 rootNode.children.push(childNode);
264             }
265 
266             console.log(rootNode);
267         }
268     }
269 
270     // 生成以rootNode为根节点的树
271     function generateSubtree(rootNode, childrenJson) {
272         for(var idx = 0; idx < childrenJson.length; ++idx) {
273             var child = childrenJson[idx];
274             // 子节点
275             var childNode = {
276                 "name": child.name,
277                 "desc": child.desc,
278                 "dsp=": child.name.startWith("节点-1") ? "Y" : "N",
279                 "children": []
280             };
281             // 如果有孩子则生成其子树
282             if (child.children != null && child.children != '[]') {
283                 generateSubtree(childNode, child.children);
284             }
285 
286             // childNode子树作为rootNode的孩子
287             rootNode.children.push(childNode);
288         }
289     }
290 
291     $(document).ready(function() {
292         // 自己动手丰富这棵树---添砖加瓦
293         generateTreeModel(stdJsonData);
294 
295         // JavaScript原生支持JSON
296         console.log(stdJsonData);
297 
298         var jsonStr = [{}, {}, {}];
299         console.log("JSON '[{}, {}, {}]' length = " + jsonStr.length);
300     });
301 </script>
302 </head>
303 <body>
304 <h1>JSON</h1>
305 </body>
306 </html>
View Code

::)

原文地址:https://www.cnblogs.com/gotodsp/p/6056634.html