jquery - jQuery从同一个类名中选择第一个对象

Question

有一些列表具有相同的类。我想显示列表中的第一个元素

<ul class="datas">
    <li class="data-smh1">abc</li>
    <li class="data-smh1">dd</li>
    <li class="data-smh1">cc</li>
    <li class="data-sc33">abc</li>
    <li class="data-sc33">dd</li>
    <li class="data-nn61">abc</li>
    <li class="data-nn61">dd</li>
</ul>

结果：

<ul class="datas">
    <li class="data-smh1">abc</li>
    <li class="data-sc33">abc</li>
    <li class="data-nn61">abc</li>
</ul>

我试过$('class[name^="data-"]'，但我找不到任何解决方案。
任何帮助，谢谢。

Answer 1

尝试

$(function(){
    $('.datas').children().each(function(i, v){
        var $this = $(this);
        $this.siblings('.' + $this.attr('class')).remove()
    });
})

演示：小提琴

Answer 2

<ul class="datas">
    <li class="data-smh1">abc</li>
    <li class="data-smh1">dd</li>
    <li class="data-smh1">cc</li>
    <li class="data-sc33">abc</li>
    <li class="data-sc33">dd</li>
    <li class="data-nn61">abc</li>
    <li class="data-nn61">dd</li>
</ul>

查询

$(document).ready(function(){
    var seen = {};
    $('.datas li').each(function(){
    //alert($(this).text());
    var txt = $(this).attr('class');
     if (seen[txt])
        $(this).remove();
    else
        seen[txt] = true;

    })
  });

结果

<ul class="datas">
    <li class="data-smh1">abc</li>


    <li class="data-sc33">abc</li>

    <li class="data-nn61">abc</li>

</ul>

JSFILDDEL 链接

Answer 3

你可以试试这个：

$(document).ready(function(){
    var curr_class = '';
    var ctr = 0;    

    $('.datas li').each(function(){
        if (curr_class !== $(this).prop('class')){
            curr_class = $(this).prop('class');
            ctr = 0;
        }
        if (ctr !== 0 ){
            $(this).remove();
        }
        ++ctr;
    });

});

jsFiddle