1

我有一个带有行的表(在下面的例子中是 div)。在这些行中是带有文本的节点。我正在尝试查看内部文本并根据内部文本对行进行排序。我已经按文本排序了,只是不知道如何以正确的顺序将节点放回屏幕上。这是我所拥有的:

<div>
    <i> - Name: Casper</i><br/>
</div>
<div>
    <i> - Name: Joe</i><br/>
</div>
<div>
    <i> - Name: Allen</i>
</div>


var originalNameNodes = $('i:contains(" - Name:")');
var numNames = originalNameNodes.length;
var namesForSorting = []

var i = 0;
originalNameNodes.each(function(){    
    namesForSorting[i] = $(this).text().replace(" - Name: ", "");    
    i = i + 1;
});

namesForSorting.sort();

for(var j = 0; j < numNames; j++){
    var sortedNameNode = originalNameNodes.find('i:contains('+namesForSorting[j]+')');
    $('body').append(sortedNameNode);    
}
4

1 回答 1

2

你会这样做:

var elems = $('div').filter(function() {
        return $('i', this).text().indexOf('Name:');
    }),
    parent = elems.first().parent();

elems.sort(function(a, b) {
   return $('i', a).text().toUpperCase().localeCompare($('i', b).text().toUpperCase());
});

$.each(elems, function(idx, itm) { parent.append(itm); });

小提琴

首先我们得到 div,我们定位所有 div 并过滤它们,只返回包含一个<i>元素的 div,如果该<i>元素包含字符串'Name:'
有很多方法可以获取 div,我只是用这个。

因为它们的 div 都是标记中的兄弟姐妹,所以只需获取第一个的父级就可以了,或者我们甚至可以使用选择器之类的选择器$('body')或其他任何方法来获取包含 div 的父元素。

函数就是它发生的sort()地方,我们不对元素进行排序<i>,而是对<div>元素进行排序,因为这样更容易,然后我们只需在子元素中查找文本<i>并进行比较a > b等,然后根据文本对元素数组进行排序in <i>,所以我们要做的就是在 DOM 中重新排列它们,然后我们append()在循环中使用 for 以与我们排序的数组相同的顺序移动元素。

于 2013-07-15T19:57:27.590 回答