Сервер возвращает объект, который нужно распарсить в HTML. У меня возникла проблема с выводом вложенных ассоциативных объектов. Подскажите пожалуйста, как вывести данные?
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script>
$(document).ready(function () {
$.getJSON("http://example.com/getList", function (data) {
var items = [];
$.each( data, function( key, val ) {
items.push( "<div id='" + key + "'>" + val + "</div>");
});
$( "<section/>", {
"class": "my-new-data",
html: items.join( "" )
}).appendTo( "body" );
});
})
</script>
JSON c сервера:
{
"list": [
{
"name": "First",
"location": {
"name": "Poland",
"code": "PL"
},
"partners": [
{
"name": "Oloo",
"value": 30
},
{
"name": "Flashset",
"value": 87
}
]
},
{
"name": "Second",
"location": {
"name": "United States",
"code": "US"
},
"partners": [
{
"name": "Thoughtsphere",
"value": 89
},
{
"name": "Gabtune",
"value": 6
},
{
"name": "Meetz",
"value": 59
}
]
}
],
"status": "OK"
}
мой код выводит в HTML следующие данные:
[object Object],[object Object] OK
нужно вывести данные в следующую разметку:
<div>
<h2>First</h2>
<div>
<p>location: Poland</p>
<p>code: PL</p>
</div>
<div>
<div>
<p>Oloo</p>
<p>value: 30</p>
</div>
<div>
<p>Flashset</p>
<p>value: 87</p>
</div>
</div>
items.push( "<div id='" + key + "'>" + val + "</div>");
еслиkey
в данной строке это число, тоval
это объект. присодиняя объект к строке, вы получаете то, что получаете. Очевидно вам надо обратиться к полям данного объекта и сформировать разметку. Сама она не материализуется.