Question

我用它来排序元素中的文本：

$('div span')
    .sort(function(a, b){
        return ($(b).text()) < ($(a).text()) ? 1 : -1; 
    })
    .appendTo('div');

在

的情况下效果很好

<div>
    <span>B</span>
    <span>C</span>
    <span>A</span>
</div>

但是我需要用逗号分隔它们（它们在排序之前已经在这里）：

<div>
    <span>B</span>, <span>C</span>, <span>A</span>
</div>

我无法理解我应该使用split在哪里用逗号分隔它们没有从头开始做所有事情是否可能？ JQuery方式。

Answer 1

您可以使用after方法：

$('div span').sort(function (a, b) {
    return ($(b).text()) < ($(a).text()) ? 1 : -1;
}).appendTo('div').not(':last').after(',');

编辑：使用textNodes会使代码无法维护，我建议将, textNodes包装为另一个元素，然后您可以轻松删除它们而不过滤元素的textNodes或重置包装元素的innerHTML ：

$('div span.comma').remove();

$('div span').sort(function (a, b) {
    return ($(b).text()) < ($(a).text()) ? 1 : -1;
}).appendTo('div').not(':last').after('<span class="comma">,</span>');

这是过滤,作为nodeValue的textNodes的一种方式：

$('div').contents().filter(function() {
    return this.nodeType === 3 && $.trim(this.nodeValue) === ','
}).remove();

排序逗号分隔的元素

1 个答案: