Javascript 将多维数组中的元素追加到html页面

我正在使用jquery设计一个分类系统，在其中我可以在多维数组中插入值，然后使用jquery将它们附加到某个html页面。我遇到了一个问题，每次向数组中添加更多元素时，我都必须更新代码

var-arr=[]

arr =
{
"a":{
      "d":"value",
      "e":"value",
      "f":"value",
      "g":{"some value":[1, 2, 3]}
    },
"b":{
    "value1":"value",
    "value2":{"aaa":{"sss": "ddd"}, "bbb":{"eee": "ddd"}},
    "value3":"value vvv"
    },
"c":[1, 2, 3]
};

我想将数组的元素附加到html页面，以便结果如下所示：

-a
--d
---value
--e
---value
--f
---value
--g
---some value
----1
----2
----3
-b
--value1
---value
--value2
---aaa
----sss
----ddd
---bbb
----eee
----ddd
--value3
---value vvv
-c
--1
--2
--3

我想编写一系列$.each语句来遍历任何多维数组（具有x个级别）并附加其元素，如上图所示。我遇到的问题是，我正在获取[object]值，我理解为什么，但我需要获取并附加所有元素。我不知道如何写$each语句

这就是我试过的

$.each(arr, function(idx, obj){ 
    $("#categories").append("--"+obj+"<br>");
    $.each(obj, function(key, value){
        $("#categories").append("--"+value+"<br>");
         //keep going with the each statements and check if the elements are objects

    });
});

$。每个（arr，函数（idx，obj）{
$（“#类别”）。追加（“-”+obj+“
”）；
$。每个（对象、功能（键、值）{
$（“#类别”）。追加（“-”+value+“
”）；
//继续执行每个语句，并检查元素是否为对象
});
});

---

对不起，我说的是英语。

这里有一把小提琴可以帮你做到这一点-我稍微列出了你的返回值，因为让返回值在字符串下面进一步缩进是没有意义的。然后，您无法判断它是键还是值

var indent = "";

function myFunction(obj) {

    indent += '-';

    for (var key in obj) {

        x = obj[key];

        if ($.isPlainObject(x)) {
            $('#categories').append(indent + key + '<br />');
            myFunction(x);
        } else {
            $('#categories').append(indent + key + '<br />');
            if (typeof x === 'object') {
                for (var key in x) {
                    $('#categories').append(indent + '-' + x[key] + '<br />');
                }
            } else {
                $('#categories').append(indent + '-' + x + '<br />');
            }
        }
    }

    indent = indent.substring(0, indent.length - 1);
}

myFunction(arr);

var indent=”“；
函数myFunction（obj）{
缩进+='-'；
for（obj中的var键）{
x=obj[键]；
如果（$.isPlainObject（x））{
$（“#categories”）.append（缩进+键+”
）；
myFunction（x）；
}否则{
$（“#categories”）.append（缩进+键+”
）；
if（typeof x==='object'）{
for（x中的var键）{
$（'#categories'）。追加（缩进+'-'+x[key]+'
'）；
}
}否则{
$（'#categories'）。追加（缩进+'-'+x+'
'）；
}
}
}
缩进=缩进子字符串（0，缩进长度-1）；
}
myFunction（arr）；

---

这里有一把小提琴可以帮你做到这一点——我稍微列出了你的返回值，因为让返回值在字符串下面进一步缩进是没有意义的。然后，您无法判断它是键还是值

var indent = "";

function myFunction(obj) {

    indent += '-';

    for (var key in obj) {

        x = obj[key];

        if ($.isPlainObject(x)) {
            $('#categories').append(indent + key + '<br />');
            myFunction(x);
        } else {
            $('#categories').append(indent + key + '<br />');
            if (typeof x === 'object') {
                for (var key in x) {
                    $('#categories').append(indent + '-' + x[key] + '<br />');
                }
            } else {
                $('#categories').append(indent + '-' + x + '<br />');
            }
        }
    }

    indent = indent.substring(0, indent.length - 1);
}

myFunction(arr);

var indent=”“；
函数myFunction（obj）{
缩进+='-'；
for（obj中的var键）{
x=obj[键]；
如果（$.isPlainObject（x））{
$（“#categories”）.append（缩进+键+”
）；
myFunction（x）；
}否则{
$（“#categories”）.append（缩进+键+”
）；
if（typeof x==='object'）{
for（x中的var键）{
$（'#categories'）。追加（缩进+'-'+x[key]+'
'）；
}
}否则{
$（'#categories'）。追加（缩进+'-'+x+'
'）；
}
}
}
缩进=缩进子字符串（0，缩进长度-1）；
}
myFunction（arr）；

---

这里有一把小提琴可以帮你做到这一点——我稍微列出了你的返回值，因为让返回值在字符串下面进一步缩进是没有意义的。然后，您无法判断它是键还是值

var indent = "";

function myFunction(obj) {

    indent += '-';

    for (var key in obj) {

        x = obj[key];

        if ($.isPlainObject(x)) {
            $('#categories').append(indent + key + '<br />');
            myFunction(x);
        } else {
            $('#categories').append(indent + key + '<br />');
            if (typeof x === 'object') {
                for (var key in x) {
                    $('#categories').append(indent + '-' + x[key] + '<br />');
                }
            } else {
                $('#categories').append(indent + '-' + x + '<br />');
            }
        }
    }

    indent = indent.substring(0, indent.length - 1);
}

myFunction(arr);

var indent=”“；
函数myFunction（obj）{
缩进+='-'；
for（obj中的var键）{
x=obj[键]；
如果（$.isPlainObject（x））{
$（“#categories”）.append（缩进+键+”
）；
myFunction（x）；
}否则{
$（“#categories”）.append（缩进+键+”
）；
if（typeof x==='object'）{
for（x中的var键）{
$（'#categories'）。追加（缩进+'-'+x[key]+'
'）；
}
}否则{
$（'#categories'）。追加（缩进+'-'+x+'
'）；
}
}
}
缩进=缩进子字符串（0，缩进长度-1）；
}
myFunction（arr）；

---

这里有一把小提琴可以帮你做到这一点——我稍微列出了你的返回值，因为让返回值在字符串下面进一步缩进是没有意义的。然后，您无法判断它是键还是值

var indent = "";

function myFunction(obj) {

    indent += '-';

    for (var key in obj) {

        x = obj[key];

        if ($.isPlainObject(x)) {
            $('#categories').append(indent + key + '<br />');
            myFunction(x);
        } else {
            $('#categories').append(indent + key + '<br />');
            if (typeof x === 'object') {
                for (var key in x) {
                    $('#categories').append(indent + '-' + x[key] + '<br />');
                }
            } else {
                $('#categories').append(indent + '-' + x + '<br />');
            }
        }
    }

    indent = indent.substring(0, indent.length - 1);
}

myFunction(arr);

var indent=”“；
函数myFunction（obj）{
缩进+='-'；
for（obj中的var键）{
x=obj[键]；
如果（$.isPlainObject（x））{
$（“#categories”）.append（缩进+键+”
）；
myFunction（x）；
}否则{
$（“#categories”）.append（缩进+键+”
）；
if（typeof x==='object'）{
for（x中的var键）{
$（'#categories'）。追加（缩进+'-'+x[key]+'
'）；
}
}否则{
$（'#categories'）。追加（缩进+'-'+x+'
'）；
}
}
}
缩进=缩进子字符串（0，缩进长度-1）；
}
myFunction（arr）；

---

几分钟后我做了

$.each(arr, function(idx, obj){ 
$("#categories").append("-"+idx+"<br>");
for(var i in obj)
{
    if (typeof (obj[i])!='number')
          $("#categories").append("--"+i+"<br>");
    if(typeof (obj[i])==='object')
    {
        for(var j in obj[i])
        {
            $("#categories").append("---"+j+"<br>");
            var len =obj[i][j].length;
            if(typeof len=='undefined')
            {
                for (var m in obj[i][j])
                    $("#categories").append("----"+m+"<br>");
                $("#categories").append("----"+obj[i][j][m]+"<br>");
            }
            else
            {
                for(var k=0;k<obj[i][j].length;k++)
                {
                   $("#categories").append("----"+obj[i][j][k]+"<br>");
                }
            }

        }
    }
    else
    {
    $("#categories").append("---"+obj[i]+"<br>");
    }
}

});

$。每个（arr，函数（idx，obj）{
$（“#类别”）。追加（“-”+idx+”
”）；
用于（obj中的var i）
{
if（类型（对象[i]）！='number'）
$（“#类别”）。追加（“-”+i+“
”）；
if（类型化（对象[i]）=='object'）
{
对于（obj[i]中的var j）
{
$（“#类别”）。追加（“--”+j+”
”）；
var len=obj[i][j]。长度；
if（typeof len==“未定义”）
{
对于（对象[i][j]中的var m）
$（“#类别”）。追加（“----”+m+“
”）；
$（“#类别”）。追加（“----”+obj[i][j][m]+“
”；
}
其他的
{
对于（var k=0；k，几分钟后我就这样做了

$.each(arr, function(idx, obj){ 
$("#categories").append("-"+idx+"<br>");
for(var i in obj)
{
    if (typeof (obj[i])!='number')
          $("#categories").append("--"+i+"<br>");
    if(typeof (obj[i])==='object')
    {
        for(var j in obj[i])
        {
            $("#categories").append("---"+j+"<br>");
            var len =obj[i][j].length;
            if(typeof len=='undefined')
            {
                for (var m in obj[i][j])
                    $("#categories").append("----"+m+"<br>");
                $("#categories").append("----"+obj[i][j][m]+"<br>");
            }
            else
            {
                for(var k=0;k<obj[i][j].length;k++)
                {
                   $("#categories").append("----"+obj[i][j][k]+"<br>");
                }
            }

        }
    }
    else
    {
    $("#categories").append("---"+obj[i]+"<br>");
    }
}

});

$。每个（arr，函数（idx，obj）{
$（“#类别”）。追加（“-”+idx+”
”）；
用于（obj中的var i）
{
if（类型（对象[i]）！='number'）
$（“#类别”）。追加（“-”+i+“
”）；
if（类型化（对象[i]）=='object'）
{
对于（obj[i]中的var j）
{
$（“#类别”）。追加（“--”+j+”
”）；
var len=obj[i][j]。长度；
if（typeof len==“未定义”）
{