Как получить массив json?

У меня есть внешний json, и я пытаюсь динамически получать значения json в моем javascript. Я могу получить значения первого уровня, и когда я пытаюсь получить объект массива, он показывает мой результат как неопределенный. Однако, когда я пытаюсь использовать этот «оповещение (data.siteAttribute[0].data[0].label);», он возвращает значение.

Вот следующее, что я пробовал

$(document).ready(function() {
	
 $.getJSON("https://api.myjson.com/bins/naqzj", function(data) { 
 
   $(".test").html('<div class = "card-deck">');
    var output = "";
    for (var i in data.siteAttribute) {
		output += "<div class='col-md-4 col-lg-3'><div class='card  site-attribute-card'>";
		
		output += "<span class='sticker sticker-rounded sticker-top-right'><span class='inline-item'><img height='50' width='50' src='"+data.siteAttribute[i].data.imageURL +"'/></span></span>";
		
		output += "<div class='card-body'> <div class='card-row'>"
        output + = "<div class='card-title text-truncate'>" + data.siteAttribute[i].data.label + "</div>";
        output += "<div class='card-text'>" + data.siteAttribute[i].data.value + "</div>";
		output + = "<div class='card-title text-truncate'>" + data.siteAttribute[i].data.operatinghours + "</div>";
        output += "<div class='card-text'>" + data.siteAttribute[i].data.hours + "</div>";
		output + = "<div class='card-title text-truncate'>" + data.siteAttribute[i].data.areaLabel + "</div>";
        output += "<div class='card-text'>" + data.siteAttribute[i].data.areaValue + "</div>";
		output + = "<div class='card-title text-truncate'>" + data.siteAttribute[i].dateModified + "</div>";
        output + = "<div class='card-text'>" + data.siteAttribute[i].date + "</div>";
		output += "</div></div>"; 
		
		output += "<div class='card-footer'>";
		output += "<div class='card-title text-truncate' title='Card Title'>"+ data.siteAttribute[i].name + "<span class='label label-tag label-category right'><span class='label-item label-item-expand'>"+data.siteAttribute[i].status+"</span></span></div>";
		output += "<div class='card-links'><a href='/group/retail/site-management-form'>Edit</a><a class='right' href='#'>View</a></div></div>"
		output += "</div></div>";    
	}
    $(".test .card-deck").append(output); 
    $(".test .card-deck").append('</div>'); 
   });
});

<script src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

<div class = "test container">
</div>

Вот мой образец рабочий пример для справки. Мне не хватает цикла для массива, и я понятия не имею, как это выяснить. Заранее спасибо!

У вас есть массив в вашем массиве, поэтому вам нужно 2 цикла

— 03.06.2019 02:32

Не могли бы вы помочь мне, как добавить второй цикл в скрипку?

— 03.06.2019 02:46

javascript jquery json

03.06.2019 02:19

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

141

Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

data.siteAttribute[i].data это массив

Таким образом, вы можете использовать data.siteAttribute[i].data[0], чтобы получить первый элемент, или вам также придется перебирать эти данные.

Спасибо за ваш вклад. Я не уверен, что использую его правильно. Вот что я пробовал в качестве второго цикла "for (var j in data.siteAttribute.data){..}", но ничего не показывает

— 03.06.2019 02:43

03.06.2019 02:36

Ответ принят как подходящий

Похоже, у вас проблемы только с вложенными циклами. Чтобы перебрать массив объектов, я предлагаю использовать Array.prototype.forEach. Чтобы упростить вашу демонстрацию, я удалил всю HTML-разметку и вложил два цикла forEach для анализа данных JSON. Пожалуйста, ознакомьтесь с демонстрацией и встроенными комментариями ниже:

$(document).ready(function() {
  $.getJSON("https://api.myjson.com/bins/naqzj", function(result) {
    // Loop over the top level attributes
    result.siteAttribute.forEach(function(attr) {
      // Loop over the attribute `data` array
      attr.data.forEach(function(attrData) {
        // For demo purposes, loop over the inner data object and print its props and values
        for (var key in attrData) {
          console.info(key, ' -> ', attrData[key]);
        }
      });
    });
  });
});

<script src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Это потрясающе! Большое спасибо за подробное объяснение.

— 03.06.2019 03:01

03.06.2019 02:46

Другие вопросы по теме

Диалоговое окно jQuery не открывается при включении в JavaScript

Функция Jquery в другую функцию не возвращает все результаты

Логика для отображения элемента HTML с комбинацией переключателей

Как отображать данные API из URL-адреса с помощью jquery datatable

DOM: отображать div, когда он находится в представлении?

Две кнопки для скольжения одного и того же div, но разными способами (справа налево и слева направо)

Javascript, если функция состояния не читает логическое значение

Несколько это, используйте первый

Как добавить несколько значений через приглашение в текстовую область, не удаляя и не изменяя другие тексты?

Как написать функцию jQuery, которая будет зацикливаться на идентификаторе данных, чтобы показать определенный элемент?

Как получить массив json?

Ответы 2

Другие вопросы по теме

Похожие вопросы