-1

Есть определенный массив с данными json. Мой код парсит только первые обьекты, хотя у этих обьектов есть еще данные внутри (items). Как сделать так, чтобы парсер забирал и внутренние элементы обьекта? К примеру id 457 должен включать только обьекты с id 458 - 459 - 460 - 461 - 464 - 581, 472 > ... и так далее

$(document).ready(function() {
  var data = [
    {
        "id": 457,
        "name": "name457",
        "code": "url457",
        "icon": "",
        "productsCount": 1,
        "items": [
            {
                "id": 458,
                "name": "name458",
                "code": "url458",
                "icon": null,
                "productsCount": 1,
                "items": [
                    {
                        "id": 741,
                        "name": "name741",
                        "code": "url741",
                        "icon": null,
                        "productsCount": 1,
                        "image": null
                    },
                    {
                        "id": 743,
                        "name": "name743",
                        "code": "url743",
                        "icon": null,
                        "productsCount": 1,
                        "image": null
                    }
                ],
                "image": null
            },
            {
                "id": 459,
                "name": "name459",
                "code": "url459",
                "icon": null,
                "productsCount": 1,
                "image": null
            },
            {
                "id": 460,
                "name": "name460",
                "code": "url460",
                "icon": null,
                "productsCount": 1,
                "image": null
            },
            {
                "id": 461,
                "name": "name461",
                "code": "url461",
                "icon": null,
                "productsCount": 1,
                "items": [
                    {
                        "id": 599,
                        "name": "name599",
                        "code": "url599",
                        "icon": null,
                        "productsCount": 1,
                        "image": null
                    },
                    {
                        "id": 742,
                        "name": "name742",
                        "code": "url742",
                        "icon": null,
                        "productsCount": 1,
                        "image": null
                    },
                    {
                        "id": 744,
                        "name": "name744",
                        "code": "url744",
                        "icon": null,
                        "productsCount": 1,
                        "image": null
                    },
                    {
                        "id": 882,
                        "name": "name882",
                        "code": "url882",
                        "icon": null,
                        "productsCount": 1,
                        "image": null
                    }
                ],
                "image": null
            },
            {
                "id": 464,
                "name": "name464",
                "code": "url464",
                "icon": null,
                "productsCount": 1,
                "items": [
                    {
                        "id": 883,
                        "name": "name883",
                        "code": "url883",
                        "icon": null,
                        "productsCount": 1,
                        "image": null
                    },
                    {
                        "id": 884,
                        "name": "name884",
                        "code": "url884",
                        "icon": null,
                        "productsCount": 1,
                        "image": null
                    }
                ],
                "image": null
            },
            {
                "id": 581,
                "name": "name581",
                "code": "url581",
                "icon": null,
                "productsCount": 1,
                "image": null
            }
        ],
        "image": null
    },
    {
        "id": 472,
        "name": "name472",
        "code": "url472",
        "icon": "milk",
        "productsCount": 1,
        "items": []
    }
]
      var keys = Object.keys(data[0]);
      var HTML = '';
      for (var i = 0; i < data.length; i++) {
        for (var j = 0; j < keys.length; j++) {
          item = data[i];
          items = keys[j];
          HTML +=
            '<div class="css-firstLVL-cat"><a class="" target="_blank" href="https://firstLVL-cat/' +
            item.code + '">' + item.name +
            '</a ><div class="css-secondLVL-cat"><a class="" target="_blank" href="https://firstLVL-cat/secondLVL-cat' +
          item.items.code + '">' + item.items.name + '</a ></div></div > ';

        }
      }
      $('#gable').append(HTML);
    
  });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<!DOCTYPE html>
<html>
<head>
  <title>Convert JSON Data to HTML</title>
</head>

<body>
  <main class="css-1">
    <div class="css-2">
      <div>
        <div>
          <div class="css-3">
            <div id="gable" class="css-items">

            </div>


          </div>
        </div>
      </div>
    </div>
  </main>
  </div>
</body>

</html>

2
  • Вариантов много посмотрите в сторону Array.filter 10 авг 2020 в 20:28
  • У вас не парсер, а генератор. Примените рекурсию типа: const generate = (element,level) => '<div...>' + element.items.map(child=>generate(child,level+1)).join("") + </div> 11 авг 2020 в 1:45

1 ответ 1

1

Рекурсия – это приём программирования, полезный в ситуациях, когда задача может быть естественно разделена на несколько аналогичных, но более простых задач.

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.