Как перемещать HTML-элемент

Как переместить элемент HTML в другой элемент. Обратите внимание: я не имею в виду позицию движущегося элемента. Рассмотрим этот код HTML:

<div id="target"></div>
<span id="to_be_moved"></span>

Я хочу переместить "to_be_moved" в "target", поэтому "target" теперь имеет дочерний "to_be_moved". Результат должен быть таким:

<div id="target"><span id="to_be_moved"></span></div>

Я искал в google (особенно с использованием прототипа), но все, что у меня есть, - это перемещение позиции, а не так, как я хочу. Спасибо раньше.

Ответ 1

document.getElementById('target').appendChild(  document.getElementById('to_be_moved') )

Ответ 2

$("target").insert($("to_be_moved").remove());

Или, для более читаемого способа...

var moveIt = $("to_be_moved").remove();
$("target").insert(moveIt);

Ответ 3

Предполагая, что вы работаете с собственными элементами DOM, метод Javascript .appendChild будет соответствовать вашим потребностям.

В собственном Javascript document.getElementByID, вероятно, лучше всего подходит для получения элемента DOM, поэтому...

var target = document.getElementById('target')
document.getElementById('to_be_moved').appendChild(target)