如何在jQuery中移动HTML元素？

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");

......或反过来使用#1and .insertAfter()和.appendTo()......或者其他几种方式实际上,它只取决于你实际使用的内容,上面的两种方法应该是最短的,但给定2个ID.

我假设这只是一个例子,记得使用不以实际HTML4页面中的数字开头的ID,它们无效并导致一些问题.

Answer 2

简单地说:

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