Javascript 如何抑制可排序的html表中重复值的显示？

我有一个HTML表格，是从XML/XSL生成的，我希望它能够抑制重复值。不过，我还想通过单击标题对其进行动态排序

如果没有到服务器的往返，我需要在每次排序后抑制不同的值。有好的javascript/css解决方案吗

比如说

数据

Date  Person Score  
May   Jeff   1  
May   Joel   2  
June  Alex   1

初始显示
注：缺少第二个5月

按分数排序后显示
注意缺少第二个1

---

使用javascript函数循环遍历相关的表列，并删除与以前相同的值。您可能还希望向具有该值的第一个单元格添加rowspan属性，以便表的语义正确

---

这不是CSS真正的工作，因为它处理信息，而不仅仅是显示东西（另外，这将非常困难）。

我个人会使用类似这样的东西。也可以使用unique（）函数删除重复项。使用jQuery比使用JS简单得多。或者我会使用JSF作为我的表示层，它已经为这种情况提供了功能

---

我真的不知道用JS做这件事的“好”方法。我所见过的JS中的每个实现都很混乱。将jQuery添加到项目中可以避免编写令人讨厌的JS代码。

我建议在td上设置一个类，使用重复的值来隐藏它们，这样就不会丢失数据。您可以循环遍历列中的每个单元格，将其与上一个单元格进行比较，如果相同，则将“duplicate”类添加到该单元格中

function after_sort(sort_column) {
    clear_duplicate_classes();

    var last = null;
    for (var i = 0; i < trs.length; i++) {
        var td = get_nth_td(trs[i], sort_column);
        if (td.innerHTML === last) {
            add_duplicate_class(td);
        }
        else {
            last = td.innerHTML;
        }
    }
}

---

这些都是完全未经测试的，所以我可能错过了一些东西。使用时请自行承担风险，等等。

请查看我的tablesorter插件：。它不是删除值本身，而是将CSS类添加到复制的值中，因此结果类似（您可以隐藏它）

---

重复的值是在响应中发送，然后使用CSS隐藏，还是不包括在响应中？我们正在发送基础值，然后希望稍后隐藏它们。否则，如果需要显示一度隐藏的值，我们将不得不进行往返。

Date  Person Score  
May   Joel   2  
June  Alex   1
May   Jeff     

function after_sort(sort_column) {
    clear_duplicate_classes();

    var last = null;
    for (var i = 0; i < trs.length; i++) {
        var td = get_nth_td(trs[i], sort_column);
        if (td.innerHTML === last) {
            add_duplicate_class(td);
        }
        else {
            last = td.innerHTML;
        }
    }
}

function after_sort(table, sort_column) {
    $(table).find(".duplicate").removeClass("duplicate");

    var last = null;
    $(table).find("tr").each(function() {
        var td = $(this).find("td").get(sort_column); // doesn't account for colspan
        if (td.innerHTML === last) {
            $(td).addClass("duplicate");
        }
        else {
            last = td.innerHTML;
        }
    });
}