Question

我一直在使用Jquery几年，但这个问题推动了我的极限。

我有一个DOM对象数组，我根据许多条件进行排序。我像这样创建数组：

var conversationsInBoxMemberUserIDsArray = $('#conversationsInBoxMessagesWrapperDIV').children().map(function() {return $(this);}).get();

推入数组的每个项目都是DOM的一部分。或者对DOM的一部分的引用可能是更好的说法。我可以看到它引用了DOM的一部分，因为当我更改顺序并将此数组追加到根DIV时，所有对象（带有内容的DIV）的顺序在视觉上发生变化。 DOM的部分喜欢这个（减少版本以节省时间/空间）：

<divContainer>
  <div_sub1>
    <div sub2>
      <h3 class="name">Adam</h3>
    </div>
  </div>
</div>

我想根据带有$（。name）

类的DOM element.text值对这个DOM对象数组进行排序

例如：A-Z基于此文本的名称值 - 例如：Ben之前的Adam

这可能吗？

可以使用标准排序功能完成：

theArray.sort(function(a, b){
   if (a.Field2 == b.Field2) return 0;
   if (a.Field2 < b.Field2) return -1;
   return 1;
 });

任何建议都将不胜感激。还需要关闭unix时间戳。

亚当

Answer 1

尝试类似

的内容

var $ct = $('#container'),
    $items = $ct.children(),
    array = $items.get();

array.sort(function (o1, o2) {
    return $(o1).find('.header h3').text().localeCompare($(o2).find('.header h3').text())
});

$ct.append(array)

演示：Fiddle

在对值进行一些缓存后，您可以尝试

var $ct = $('#container'),
    $items = $ct.children(),
    array = $items.map(function () {
        var $this = $(this);
        $this.data('header', $.trim($this.find('.header h3').text()))
        return $this;
    }).get();

array.sort(function (o1, o2) {
    return o1.data('header').localeCompare(o2.data('header'))
});

$ct.append(array)

演示：Fiddle

Answer 2

你可以这样做：

var arr_children_to_sort = $('div').children(...);

arr_children_to_sort.sort(function(a, b) {
    if ($(a).find('h3').hasClass('name')) {
        if ($(b).find('h3').hasClass('name')) {
            return (($(a).find('h3').text() >= $(b).find('h3').text()) ? 1 : -1);
        }
        return 1;
    }
    else if ($(b).find('h3').hasClass('name')) {
        return -1;
    }

    return 0;
});

只需切换return语句的值即可设置所需的实际顺序。

基于DOM值的JQuery排序DOM对象数组

2 个答案: