从A-Z订购div [英] Ordering divs from A-Z

问题描述

我有一个聊天网页，每个会员都有一个DIV。 DIV的外观如下：

I have a chat web page that has a DIV for each member. The DIV's look as follows:

 <div id="chatCenterMembers">
   <div id="lee" class="chatmember 10001"></div>
   <div id="arch" class="chatmember 10008"></div>
   <div id="steven" class="chatmember 10041"></div>
   <div id="tim" class="chatmember 10432"></div>
   <div id="ssan" class="chatmember 10007"></div>
   <div id="yanti" class="chatmember 10034"></div>
 </div>

每个聊天会员DIV都有更多内容 - img，text等。
如何使用JQUERY从AZ重新订购div？
我想保留每个DIV的内容 - 只需将ID移动到类似于AZ。

Each of the "chatmember" DIV's have more content inside them - img, text etc. How can I re-order the div's from A-Z using JQUERY? I want to keep the contents with each DIV as it is - just move the ID to resemble A-Z.

推荐答案

您可以获得一个子 div 元素的集合，然后使用 sort（）按其<$ c $排序c> id 属性，然后将其附加到容器中，有效地重新排序它们。

You could get a collection of child div elements, and then use sort() to sort by their id attribute, and then append this to the container, effectively reordering them.

var parent = $('#chatCenterMembers');

parent.children('div').sort(function(a, b) {
   return a.id > b.id;
}).appendTo(parent);

jsFiddle 。

这篇关于从A-Z订购div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！