Преобразование массива HTML-элементов в Nodelist

Question

Я пишу функцию для изменения положения дочерних элементов в родительском элементе.

<div class="parent">
    <div class="first-child"></div>
    <div class="second-child"></div>
</div>

Итак, я получаю потомков.parent, превращающих Nodelist в массив, переупорядочив массив, чтобы поменять местами порядок / положение элементов, т.е. первый-второй, второй-дочерний становится вторым-дочерним, первый-дочерний, Тем не менее, в идеале функция должна возвращать родительский элемент с переупорядоченной структурой, но поскольку я эффективно разделил список узлов на массив, элементы в массиве больше не считаются "узлами", что означает ошибку при попытке добавить его как дочерний элемент. к родителю.

Итак, как я могу преобразовать массив элементов обратно в Nodelist, так как я понимаю, что Nodelist не является родным для javascript?

Вот Codepen того, что у меня до сих пор. http://codepen.io/anon/pen/QNPKqB?editors=0011

Спасибо!

Answer 1

Ошибка в вашем коде не в том, что вам нужен NodeList, а в том, что вы назвали как функцию, так и замену элемента.

var parent = document.querySelector('.swap');
swap(parent, first, second);

Это то, что вам нужно

У меня нет учетной записи codepen, поэтому посмотрите рабочий код здесь: https://jsfiddle.net/owr15hnf/

Answer 2

Вот как вы можете преобразовать HTML в список узлов,

          const targetElement = document.getElementById('targetElement');

    const htmlElementsArray = Array.from(targetElement.children).map(el => el.outerHTML)
    // htmlElementsArray contains an array of HTML Elements.

    console.log(htmlElementsArray,'ArrayList.')
    
    const nodeList = new DOMParser().parseFromString([htmlElementsArray].join(''), "text/html").body.childNodes;
    // nodeList is the converted Html list to node list

    console.log(nodeList,'nodeList')

Вы можете найти пример здесь: https://codepen.io/furki911/pen/qByzdXm?editors=1111