jQuery - 按id按降序排列元素的按钮[重复]答案

【问题标题】：jQuery - Button to arrange elements by id in descending order [duplicate]jQuery - 按id按降序排列元素的按钮[重复]
【发布时间】：2014-07-12 01:11:29
【问题描述】：

我有一组 id 为 0、1、2、3、n 的 div。它们在 php 中按升序生成。我想制作一个按钮来重新排列它们，以便它们使用 jquery 以降序显示。我完全不知道如何做到这一点。谁能给我推荐一篇文章或什么的？

代码：

<span>
    <div id="0">...</div>
    <div id="1">...</div>
    <div id="2">...</div>
    <div id="3">...</div>
    <div id="4">...</div>
    ...
</span>

我想要一个按钮来制作它：

<span>
....
    <div id="4">...</div>
    <div id="3">...</div>
    <div id="2">...</div>
    <div id="1">...</div>
    <div id="0">...</div>
</span>

【问题讨论】：

对于您的具体问题实例：jQuery reversing the order of child elements
那些 lis 没有 id；因此，切换顺序的代码不同。
但您接受的解决方案并未考虑 div 元素的 ID。所以我想知道为什么li 元素没有ID 很重要。当然，实现同一个目标有多种方法。

标签： javascript jquery

【解决方案1】：

试试这个

$('span div').each(function() {
    $(this).insertBefore('span div:first');
});

http://jsfiddle.net/BS4g3/

【讨论】：

我工作，但我似乎用 .click 触发它。
jsfiddle.net/BS4g3/5 这里有一个按钮

【解决方案2】：

很简单。

假设你有这个当前的 HTML：

<span>
    <div id="0">1</div>
    <div id="1">2</div>
    <div id="2">3</div>
    <div id="3">4</div>
    <div id="4">5</div>
</span>

使用简单的 jQuery reverse 会得到你需要的结果：

$($("div").slice(1).get().reverse())
   .insertBefore("div:first");

结果：

检查这个小提琴：

http://jsfiddle.net/66QDc/

编辑：

我更新了小提琴一个按钮来完成任务：

http://jsfiddle.net/66QDc/1/

【讨论】：

你这个摇滚男人！帮了我很多！
谢谢你:)。我真的很感激。