Olga27,
не надо простыней, будьте лаконичней)))
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
</style>
<script>
let data = {
"response": [{
"title": "test1",
"status": "current",
"text": "text1",
"Discription": "Описание1",
"photo": [{
"big": {
"status": "wait",
"width": "772",
"height": "960",
"url": "https://site.ru/image/big_1_1.jpg"
},
"small": {
"status": "wait",
"width": "105",
"height": "130",
"url": "https://site.ru/image/small_1_1.jpg"
}
},
{
"big": {
"status": "wait",
"width": "774",
"height": "960",
"url": "https://site.ru/image/big_1_2.jpg"
},
"small": {
"status": "wait",
"width": "105",
"height": "130",
"url": "https://site.ru/image/small_1_2.jpg"
}
}
]
},
{
"title": "test2",
"status": "wait",
"text": "text2",
"Discription": "Описание2",
"photo": [{
"big": {
"status": "wait",
"width": "772",
"height": "960",
"url": "https://site.ru/image/big_2_1.jpg"
},
"small": {
"status": "wait",
"width": "105",
"height": "130",
"url": "https://site.ru/image/small_2_1.jpg"
}
},
{
"big": {
"status": "wait",
"width": "772",
"height": "960",
"url": "https://site.ru/image/big_2_2.jpg"
},
"small": {
"status": "wait",
"width": "105",
"height": "130",
"url": "https://site.ru/image/small_2_2.jpg"
}
},
{
"big": {
"status": "wait",
"width": "772",
"height": "960",
"url": "https://site.ru/image/big_2_3.jpg"
},
"small": {
"status": "wait",
"width": "105",
"height": "130",
"url": "https://site.ru/image/small_2_3.jpg"
}
},
{
"big": {
"status": "wait",
"width": "772",
"height": "960",
"url": "https://site.ru/image/big_2_4.jpg"
},
"small": {
"status": "wait",
"width": "105",
"height": "130",
"url": "https://site.ru/image/small_2_4.jpg"
}
}
]
}
]
};
</script>
</head>
<body>
<div id="tree"></div>
<script>
function recursiveList(data) {
let html = Object.entries(data).map(([key, value]) => {
let type = typeof value;
let li = document.createElement("li");
li.textContent = `[${key}]`;
if (type === "object") {
let ul = document.createElement("UL");
value = recursiveList(value);
ul.append(...value);
li.append(ul);
} else {
li.textContent += ` ${value}`;
}
return li;
})
return html
}
let html = recursiveList(data);
tree.append(...html);
</script>
</body>
</html>