Использование JavaScript insertBefore () для вставки перед TextNode?

Question

У меня есть HTML вроде следующего:

<div id="move-me">
    <a href="#">I'm a link</a>
</div>

<div id="new-parent">
    Some plain text.
</div>

Я пытаюсь написать JavaScript, который переместит весь div # move-me внутри # new-parent div, выше текст, например, так:

<div id="new-parent">
    <div id="move-me">
        <a href="#">I'm a link</a>
    </div>
    Some plain text.
</div>

Вот мой JavaScript:

function moveDiv() {
    var moveable = document.getElementById('move-me');
    var newParent = document.getElementById('new-parent');
    newParent.parentNode.insertBefore(moveable, newParent.firstChild);
}

Я использую Firebug для отладки, и я вижу, что newParent.firstChild это TextNode, но я всегда получаю следующую ошибку:

Node was not found" code: "8
newParent.parentNode.insertBefore(moveable, newParent.firstChild); 

Кажется, что insertBefore требует узла элемента и не будет работать на текстовом узле ... это правильно?Если да, есть ли другой хороший способ сделать это?

Примечание : я не могу изменить или очистить HTML-код, чтобы включить теги абзаца или удалить пробелы.

Answer 1

Нет, insertBefore будет нормально работать с текстовым узлом в качестве узла, который будет вставлен ранее. Проблема в том, что узел, который вы пытаетесь вставить ранее, не является дочерним узлом узла, в который вы вставляете. Вам нужно удалить бит .parentNode:

newParent.insertBefore(moveable, newParent.firstChild); 

Answer 2

Вам необходимо удалить «.parentNode» из оператора вставки.Текстовый узел все еще является узлом и на него можно ссылаться, как на любой другой узел.