Jquery 使用已排序的数组对div进行排序

我是新来的，不熟悉Javascript和web编程，事实上我知道一点Java不适合web。所以这里的问题是，我有一个更具体的专辑名称字符串数组，我实际上根据专辑名称对这个数组进行了排序。 现在我已经对这个数组进行了排序，我的下一步将是对代表每个专辑的div进行排序，但我实际上不知道如何使用JQuery进行排序。 以下是我的div在页面中的分布方式：

<div id="products" >
   <div class="line">
      <div id="product-Album-name"></div>
      <div id="product-Album-name"></div>
      <div id="product-Album-name"></div>
      <div id="product-Album-name"></div>
   </div>
   <div class="line">
      <div id="product-Album-name"></div>
      <div id="product-Album-name"></div>
      <div id="product-Album-name"></div>
      <div id="product-Album-name"></div>
   </div>
   <div class="line">
      <div id="product-Album-name"></div>
      <div id="product-Album-name"></div>
      <div id="product-Album-name"></div>
      <div id="product-Album-name"></div>
   </div>
   <div class="line">
      <div id="product-Album-name"></div>
      <div id="product-Album-name"></div>
      <div id="product-Album-name"></div>
      <div id="product-Album-name"></div>
   </div>
</div>

我的目标是用id=product-Album-name对所有div进行排序。 有什么建议吗？

---

提前谢谢。

首先我发现您的元素id不是唯一的。。根据HTML标准，id在文档中应该是唯一的。。为什么不用类来代替呢

<div class="products" >
   <div class="line">
      <div class="product-Album-name"></div>
      <div class="product-Album-name"></div>
      <div class="product-Album-name"></div>
      <div class="product-Album-name"></div>
   </div>
   <div class="line">
      <div class="product-Album-name"></div>
      <div class="product-Album-name"></div>
      <div class="product-Album-name"></div>
      <div class="product-Album-name"></div>
   </div>
   <div class="line">
      <div class="product-Album-name"></div>
      <div class="product-Album-name"></div>
      <div class="product-Album-name"></div>
      <div class="product-Album-name"></div>
   </div>
   <div class="line">
      <div class="product-Album-name"></div>
      <div class="product-Album-name"></div>
      <div class="product-Album-name"></div>
      <div class="product-Album-name"></div>
   </div>
</div>

---

此外，由于所有div都是相同的，如果没有明显差异，如何对其进行排序

我在中重新创建了一个场景。它使用jQuery和预先排序的相册列表，创建相册名称部分，每个部分由4个相册分组。。。部分您可以修改索引%4，以便按组更改订单金额。

ID必须唯一。你的div应该如何排序？到目前为止你做了哪些尝试？你想如何排序？在你的例子中没有区别，所以你不能对它们进行排序。我只是假设OP使用它作为替身。我想他们是独一无二的。。。有了专辑的ID，我知道这个答案太长了，不能作为评论，但它实际上是一个评论。这并没有回答问题。是的，这只是一个例子，ID是唯一的，并且根据专辑的具体情况，这实际上是我想要的。非常感谢alexi，但是还有一些信息我没有告诉你。我在我的网站上使用Liquid for designers语言，它实际上在某些方面是有用的，我可以进行分页，实际上我可以使用class=line动态插入div，其中包含4或5个产品，仅使用Liquid语言。因此，如果我使用您的代码，我将不得不使用Javascript对分页进行正确的操作？是吗？这是我的网页：biscoitofino.jumpseller.com/catalogo@Leo，这不是一个容易的问题。你可以这样做，也可以不这样做。这取决于你如何处理这个问题。如果可以使用一些REST调用将相册列表作为JSON对象检索，则不需要更改分页，比如，http://biscoitofino.jumpseller.com/catalogoJSON?page=2 它将检索一个已排序的相册数组，然后使用jQuery和AJAX您可以检索列表并稍微修改我在上面编写的代码以更新UI。在这种情况下，当您单击页面链接时，UI上的列表将动态更新，而不会刷新整个页面？我知道有一种方法可以用它的内容克隆一个DIV并改变它的位置，但我不知道怎么做。有什么建议吗？嗨，利奥，请看。我已经更新了代码以使用现有的div列表。希望这个脚本有帮助。在本例中，ID是按字母顺序排序的，因此当您看到album1、album10、album11等时，请不要混淆。。为了对只有数字id的DIV进行排序，我在其中添加了注释行和注释。希望这有帮助。