1

Тема: Побудова DOM дерева з даних масиву.

Доброго дня! Я початківець, маю одне питання яке не можу вирішити... Є ось такий масив даних, що знаходиться нижче. Потрібно написати функцію, яка приймає цей масив даних та циклом перебирає його і будує dom дерево по глубині вкладеної структури. напрклад за допомогою ul та li списків. Я розумію що це треба рекурсією зробити але ніяк не виходить. Дякую наперед з пораду!!!


var structure = [
  {
    "folder": true,
    "title": "Music",
    "children": [
      {
        "title": "Dan Balan.avi"
      },
      {
        "folder": true,
        "title": "Comedy",
        "children": [
          {
            "title": "Game of Thrones.avi"
          },
          {
            "folder": true,
            "title": 'New folder 1',
            "children": false
          }
        ]
      }
    ]
  },
  {
    "folder": true,
    "title": "Documents",
    "children": [
      {
        "folder": true,
        "title": "Question and answers",
        "children": null
      }
    ]
  }
];

2

Re: Побудова DOM дерева з даних масиву.

Коли ви реєструвалися на цьому сайті, то ставили галочку, що прочитали правила. То навіщо ж ви змушуєте модераторів цитувати вам ті правила - тільки для того, щоб їх подражнити? Повірте, це не найкраща ідея, якщо, звісно, вам треба щось конкретне отримати, а не тупо тролити модераторів. ДЕ ВАШІ НАПРАЦЮВАННЯ?

3.5. Теми без будь-яких напрацювань будуть просто ігноруватись учасниками форуму, а модератори при першій можливості перенесуть їх в кошик для сміття.

http://replace.org.ua/rules/

3

Re: Побудова DOM дерева з даних масиву.

http://www.codeabbey.com/index/task_vie … g-brackets
розвяжіть оцю задачу, це ключ до вашої

4

Re: Побудова DOM дерева з даних масиву.

нафіга вам та рекурсія, коли є чудові цикли.
от вам спрощений алгоритм.
Спочатку я б ті дані перевів в об'єкт, для цього я б використав JSON.parse(і сюди йде рядок з вашими даними).
Далі я б використав for of цикл, бо я бачу, що сама структура представляє з себе масив об'єктів.
Далі ми створюємо елемент... ой, слухайте, а рекурсія таки потрібна.
Окей, далі ми створюємо елемент з даними поточного об'єкту (це ще в for of циклі), а далі передаємо children цього об'єкта в функцію, а ще в цю функцію треба передати останній створений елемент.
В цій функції ми запускаємо ще один цикл for of, але тепер перебираємо елементи масиву children, в котрому робимо те саме, що і в першому циклі for of. Тобто, створюємо елемент, додаємо його всередину елементу, котрі отримали як аргумент функції, і перевіряємо, чи поточний об'єкт містить children, якщо містить - то викликаємо цю ж саму функцію, і передаємо в неї children нового об`єкту і сам об'єкт, от вам і рекурсія.
Або в функцію можна передавати лише об'єкт, і потім звертатись до його children, аби не передавати і об'єкт і його children як аргументи.

5 Востаннє редагувалося webguru (14.04.2018 14:02:20)

Re: Побудова DOM дерева з даних масиву.

ось знайшов чудовий мануал по роботі з dom  http://webdiz.com.ua/glava6-rabota-s-do … -stranicy/