Comment déplacer un élément HTML dans jQuery?

Question

Ma structure HTML est comme ceci:

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

Je veux déplacer l'élément id="2" à placer avant id="1" si sa sera comme ceci:

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

Comment dois-je faire quelque chose comme ça dans jQuery ?

Answer 1

Vous pouvez utiliser .insertBefore(), comme ceci:

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

Ou, .prependTo(), comme ceci:

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

... ou l'inverse en utilisant #1 et .insertAfter() et .appendTo() ... ou plusieurs D'autres façons en fait, cela dépend de ce que vous êtes réellement après, les 2 méthodes ci-dessus devraient être sur le plus court possible, compte tenu de 2 ID.

Je suis en supposant ceci est juste un exemple, n'oubliez pas d'utiliser les ID qui ne commencent pas par un nombre dans une page HTML4 réelle, ils sont invalides et causent plusieurs problèmes.

Answer 2

Vous avez déjà pensé à utiliser jQuery UI Sortable?

Answer 3

simplement:

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