遍历嵌套JavaScript对象和数组时出现问题

Problem looping through nested JavaScript objects and arrays

本文关键字:问题 数组 嵌套 JavaScript 对象 遍历      更新时间:2023-09-26

我需要显示子值,但是它像那样显示[object, object]所以

下面是我的代码:

var jsonObj = {"department":{
              "Title1":[
                           {"child1":"Green",
                            "child2":"Yellow"
                           },
                           {"child3":"Black",
                            "child4":"White"
                           }
                           ],
              "Title2":[
                           {"child5":"Violet",
                            "child6":"purple"
                           },
                          {"child7":"Pink",
                            "child8":"Orange"
                           }
                           ]
  }
}
$(document).ready(function() {
var  treeList = "";
treeList = "<ul id='"createTree'">";     
for(var key in jsonObj){
        for(var subKey in jsonObj[key]){
        alert(subKey);
        //for(i=0; i<jsonObj[key].length;i++ ) {
           treeList +=  ("<li>" + subKey + "<ul><li>"+jsonObj[key][subKey]+"</li></ul></li>");
           //var b = $(c).text();
           alert(treeList);
       }
    }
treeList += "</ul>";
$('#tree').append(treeList);
});

正如Quentin所说,您需要不断深入,首先深入到数组中,然后深入到数组中包含的对象。下面的代码应该访问JSON中保存的所有变量,您可能必须重新构建它输出的HTML以使其看起来像您想要的那样-

$(document).ready(function() {
var  treeList = "";
treeList = "<ul id='"createTree'">";     
for(var key in jsonObj){
        for(var subKey in jsonObj[key]){
        alert(subKey);
        for(i=0; i<jsonObj[key][subKey].length;i++ ) {
           for(var arrayKey in jsonObj[key][subKey][i]){ 
              treeList +=  ("<li>" + subKey + " - " + arrayKey  + " - "+jsonObj[key][subKey][i][arrayKey]+"</li></ul></li>");
           }    
           //var b = $(c).text();
           alert(treeList);
        }   
       }
    }
    treeList += "</ul>";
    $('#tree').append(treeList);
}); 

第一个jsonObj[key][subKey]将是jsonObj.department.Title1。这是一个数组

当你对一个数组进行字符串化时,默认情况下,它会产生一个泛型的"This is an object"文本。

如果您想要显示其中的数据,则必须继续向下获取字符串