Jak przenieść element HTML w jQuery?

Question

Moja struktura HTML jest tak:

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

Chcę przenieść element id="2" umieścić przed id="1" więc jej będzie tak:

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

Jak mogę zrobić coś podobnego w jQuery ?

Answer 1

Można użyć .insertBefore() coś takiego:

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

Albo .prependTo(), tak:

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

... albo na odwrót za pomocą #1 i .insertAfter() i .appendTo() ... lub kilka inne sposoby w rzeczywistości, to po prostu zależy od tego, po co faktycznie jesteś, powyższe 2 metody powinny być możliwie najkrótsze, z 2 identyfikatorami.

Jestem przy założeniu, że to tylko przykład, pamiętaj, aby używać identyfikatorów, które nie zaczynają się od liczby na prawdziwej stronie HTML4, są nieprawidłowe i powodują kilka problemów.

Answer 2

Czy myślałeś kiedyś o używaniu jQuery UI Sortable?

Answer 3

Wystarczy zrobić:

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