Данные из json в html
Имеется:
{
"items": [
{
"id": "01",
"text": "TEXT",
"likes": {
"count": 1,
"can_like": 1
},
"date": 0000,
"comments": {
"count": 1,
"can_post": 1
},
"attachments": [
{
"type": "photo",
"photo": {
"photo_130": "http://1.jpg",
"date": 0000,
"id": 01
}
}
]
},
{
"id": "02",
"text": "TEXT2",
"likes": {
"count": 2,
"can_like": 2
},
"date": 0000,
"comments": {
"count": 2,
"can_post": 2
},
"attachments": [
{
"type": "photo",
"photo": {
"photo_130": "http://2.jpg",
"date": 0000,
"id": 02
}
},
{
"type": "photo",
"photo": {
"photo_130": "http://3.jpg",
"date": 0000,
"id": 03
}
},
{
"type": "photo",
"photo": {
"photo_130": "http://4.jpg",
"date": 0000,
"id": 04
}
}
]
}
]
}
<div id="box"></div>
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script>
$.getJSON('test.json', function(data) {
var output="<div>";
for (var i in data.items) {
output+="<div>" + data.items[i].id + "</div>";
output+="<div>" + data.items[i].text + "</div>";
output+="<div>" + data.items[i].likes.count + "</div>";
output+="<div>" + data.items[i].comments.count + "</div>";
output+="<div>" + data.items[i].attachments[0].photo.photo_130 + "</div>";
}
output+="</div>";
}
document.getElementById("box").innerHTML=output;
});
</script>
На выходе получаю пустую страницу:cray: |
jsnoob4ik,
15 строка |
Исправил. Теперь так выглядит
<div id="box"></div>
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script>
$.getJSON('test.json', function(data) {
var output="<div>";
for (var i in data.items) {
output+="<div>" + data.items[i].id + "</div>";
output+="<div>" + data.items[i].text + "</div>";
output+="<div>" + data.items[i].likes.count + "</div>";
output+="<div>" + data.items[i].comments.count + "</div>";
/*output+="<div>" + data.items[i].attachments[0].photo.photo_130 + "</div>";*/
}
output+="</div>";
document.getElementById("box").innerHTML=output;
});
</script>
Все равно пустую страницу отдает. |
jsnoob4ik,
а data есть?
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
</head>
<body> <div id="box"></div>
<script>
var data = {
"items": [
{
"id": "01",
"text": "TEXT",
"likes": {
"count": 1,
"can_like": 1
},
"date": 0000,
"comments": {
"count": 1,
"can_post": 1
},
"attachments": [
{
"type": "photo",
"photo": {
"photo_130": "http://1.jpg",
"date": 0000,
"id": 01
}
}
]
},
{
"id": "02",
"text": "TEXT2",
"likes": {
"count": 2,
"can_like": 2
},
"date": 0000,
"comments": {
"count": 2,
"can_post": 2
},
"attachments": [
{
"type": "photo",
"photo": {
"photo_130": "http://2.jpg",
"date": 0000,
"id": 02
}
},
{
"type": "photo",
"photo": {
"photo_130": "http://3.jpg",
"date": 0000,
"id": 03
}
},
{
"type": "photo",
"photo": {
"photo_130": "http://4.jpg",
"date": 0000,
"id": 04
}
}
]
}
]
}
var output="<div>";
for (var i in data.items) {
output+="<div>" + data.items[i].id + "</div>";
output+="<div>" + data.items[i].text + "</div>";
output+="<div>" + data.items[i].likes.count + "</div>";
output+="<div>" + data.items[i].comments.count + "</div>";
for (var k in data.items[i].attachments) output+="<div>" + data.items[i].attachments[k].photo.photo_130 + "</div>";
}
output+="</div>";
document.getElementById("box").innerHTML=output;
</script>
</body>
</html>
|
json данные находятся в отдельном файле. test.json Проверил Ваш код, он отрабатывает, но не полноценно. Не выводятся Фото3, Фото4
|
Цитата:
|
jsnoob4ik,
добавил вывод строка 83 |
Спасибо, действительно работает (в том виде что Вы прислали). Но с подгрузкой из отдельного файла почему то не хочет работать. Не подскажите в чем проблема?
|
jsnoob4ik,
скорее всего сервер присылает не строку а обьект -- вам же виднее что приходит в дата |
Все верно. Но как же сделать так, что бы он присылал строку а не объект?
|
| Часовой пояс GMT +3, время: 06:23. |