Перемещение дочерних узлов к другому родителю влияет только на половину из них

Question

Я пытаюсь переместить все дочерние узлы от одного родителя к другому, используя NodeList.forEach(), но это работает только для половины из них.

parent.childNodes.forEach(child => newParent.appendChild(child))

Вы можете попробовать себя здесь: https://jsfiddle.net/t4g0vje2/3/

Я хочу знать: почему это происходит? Каково ваше лучшее решение, которое волнует всех детей?

Answer 1

Кажется, что дочерний узел удаляется из parent.childNodes каждый раз

child => newParent.appendChild(child)

выполняется. Таким образом, у вас возникла проблема, поскольку ваша коллекция изменяется каждый раз, когда выполняется указанная выше строка.

Array.from(parent.childNodes).forEach(child => newParent.appendChild(child))

сделает свое дело, так как вы сначала создаете новый массив из 10 элементов и проходите через все 10 элементов