Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Помогите с деревом (https://javascript.ru/forum/misc/65729-pomogite-s-derevom.html)

Antonqq 05.11.2016 01:54

Помогите с деревом
 
Помогите пожалуйста, уже два дня мучаюсь, ничего не выходит.

Есть такой код, он выводится из бд.
data-id - это id записи.
Нужно получить из этого, вот такой массив. arr[0] {21,22,23}



<li class="dd-item" data-id="21">
	<div class="dd-handle">Раздел 1</div>
	<ul class="dd-list">
		<li class="dd-item" data-id="22">
			<div class="dd-handle">Раздел 1.1</div>
		</li>
		<li class="dd-item" data-id="23">
			<div class="dd-handle">Раздел 1.2</div>
		</li>
	</ul>
</li>

Aetae 05.11.2016 02:14

Array.from( document.querySelectorAll('[data-id]'), element => +element.dataset.id )

Antonqq 05.11.2016 02:28

Помогите пожалуйста
 
А можно как-то вывести дочерние элементы ?
как-то так,
arr[0] (21, children[0] (22,23) )
и т.д.
arr[1] (24, children[0] (25,26) )

Lemme 05.11.2016 04:27

Aetae, человек обфускатор =)

рони 05.11.2016 10:41

Цитата:

Сообщение от Antonqq
arr[0] {21,22,23}

Цитата:

Сообщение от Antonqq
arr[0] (21, children[0] (22,23) )

интересно как это на js будет выглядеть?

Aetae 05.11.2016 18:08

Lemme, ага, я тоже так могу.)
Например для второй части вопроса:
function parse(root){
  var rootArray = [];
  var map = new Map( 
    Array.from( 
      root.querySelectorAll('[data-id]'), 
      element => [
        element, 
        { 
          name: element.dataset.id, 
          children: [] 
        }
      ]
    ) 
  );

  for(let [element, object] of map){
    while((element = element.parentNode) !== root && !map.has(element)); 
    if(element === root) rootArray.push(object);
    else map.get(element).children.push(object);
  }
  return 'id' in root.dataset ? [{ 
    name: root.dataset.id, 
    children: rootArray
  }] : rootArray;
}
:)

Antonqq 05.11.2016 20:04

Не работает :(
Может я не правильно передаю параметр..
alert (parse('.list'));

Ничего не возвращает.
.list - блок ul

Aetae 05.11.2016 20:09

Это вам не jquery, тут элемент требуется.)
parse( document.querySelector('.list') );

Antonqq 05.11.2016 20:21

Все работает, спасибо большое:)


Часовой пояс GMT +3, время: 04:52.