操作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>
::)
