Как мне переместить элемент HTML в jQuery?

Question

Моя структура HTML выглядит следующим образом:

<div id="parent">
   <div id="1">Some content</div>
   <div id="2">Some content</div>
</div>

Я хочу переместить элемент id="2", чтобы поместить его перед id="1", поэтому он будет выглядеть так:

<div id="parent">
   <div id="2">Some content</div>
   <div id="1">Some content</div>
</div>

Как мне сделать что-то подобное в jQuery?

Answer 1

Вы можете использовать .insertBefore(), например:

$("#2").insertBefore("#1");

Или .prependTo(), например:

$("#2").prependTo("#parent");

... или наоборот, используя #1 и .insertAfter() и .appendTo() ... или несколько других способов на самом деле, это просто зависит от того, что вы на самом деле послевышеупомянутые 2 метода должны быть как можно более короткими, учитывая 2 идентификатора.

Я при условии это только пример, не забудьте использовать идентификаторы, которые не начинаются счисло на реальной странице HTML4, они недействительны и вызывают несколько проблем.

Answer 2

Просто сделайте:

$('#1').before($('#2'));

Answer 3

Когда-нибудь задумывались об использовании jQuery UI Sortable ?