Как упорядочить массив, содержащий порядок элементов в чистом JS - PullRequest
Новая
       8

Как упорядочить массив, содержащий порядок элементов в чистом JS

0 голосов
/ 09 января 2019

Скажем, у меня есть массив из 10 элементов, некоторые из которых на самом деле являются потомками некоторых других элементов. Как бы я упорядочил этот массив так, чтобы первыми были первые родители, а последними были самые глубокие дети? 

[
    input,
    select,
    radio,
    div (containing some of the form elements in the array),
    h2,
    div (containing the h2 in the array),
    form,
    textarea,
    a,
    span
]

В данном конкретном случае элемент формы может быть родительским элементом toppest, но решение, которое я ищу, состоит в том, чтобы создать такой заказ без каких-либо знаний

1 Ответ

0 голосов
/ 09 января 2019

Вы можете использовать Array.map() для создания оценки для каждого элемента - оценка основана на количестве родительских элементов, которыми обладает элемент. Теперь вы можете сортировать элементы по их количеству и извлекать элементы, используя другое Array.map(): 

const els = Array.from(document.querySelectorAll('div *'))
  .map(el => {
    let score = 0, p = el;
    
    while(p = p.parentNode) { score++; }
    
    return [el, score];
  })
  .sort(([ea, sa], [eb, sb]) => sa - sb)
  .map(([el]) => el)

console.log(els);
<div>
  <form>
    <div class="form-els-container">
      <input>
      <select></select>
      <input type="radio">  
      <textarea></textarea>
    </div>
  </form>
  <div class="h2-container">
    <h2>H2</h2>
  </div>
  <a>a</a>
  <span></span>
</div>
...