将最后一个子元素移动到第一位置

Question

My HTML:

  <div id="my-slider">
    <img src="/slider/pic/bf3.jpg" alt="picture">
    <img src="/slider/pic/bf3_cq.jpg" alt="picture">
    <!-- etc -->
  </div>

在特定事件中，我希望将最后一个img标签移动到第一个位置（根据父级）。

我尝试过：

    curr.css('left', 0);
    curr.prepend(curr.parent()); 

我可以更改 CSS，但第二行出现错误：

层次请求错误：无法将节点插入到层次结构中指定的位置

有人能给我一些建议吗？

- keram

---

为什么要改变CSS？你不能使用以下代码吗："remove()"最后一个图像标签（分配给var）+ "before()" img:first？ - hovanessyan

我需要这个，我尝试制作一个环形滑块。 - keram

你可以始终使用detach（而不是remove）和prepend... - AdityaParab

Answer 1

curr.parent().prepend(curr);

或者

curr.prependTo(curr.parent()); 

- adeneo

---

我们不需要使用.detach()吗？ 或者prepend会隐式地分离它？ - AdityaParab

在DOM中添加一个已存在的元素会将其移动，因此无需先使用detach()将其分离。 - adeneo

Answer 2

你可以使用 prepend():

$('#my-slider').prepend($('#my-slider img:last'))

http://jsfiddle.net/Uttv8/

- Ram

Answer 3

试试这个 http://jsfiddle.net/uttara/TFYXA/

$("#my-slider img:last-child").prependTo("#my-slider")

- Uttara