Question

<ul class="topunm">
<li><a href="#">test</a></li>
<li><a href="#">test</a></li>
<li><a href="#">test</a></li>
<li><a href="#">test</a></li>
<li><a href="#">test</a></li>
<li><a href="#">test</a></li>
</ul>

我想在李之前加上这个号码。以下是我的代码：

$("ul.code-topnumb > li").each(function() {
    $(this).prepend('<span class="num">' + ($(this).index() +1) + "</span>");
})

但现在，我想只为前三个数字添加背景。如何更改代码？谢谢。

Answer 1

我想你想做这样的事情。如果您希望跨度超出prepend标记，则可能需要将before更改为li。但我认为直接在<span>

中<ul>是有效的

$("ul.topnum > li").each(function(i, el) {
    if(i < 3)
        $(el).css('background-color', '#0FF');
    $(el).prepend('<span class="num">' + (i+1) + "</span>");
})

Answer 2

这样的东西？

$("ul.code-topnumb > li").each(function() {
    var cl;

    if($(this).index() < 3){
        cl = "num bgnd";
    }else{
        cl = "num";
    }

    $(this).prepend('<span class="' + cl + '">' + ($(this).index() +1) + "</span>");
})

Answer 3

使用slice：

$(function(){
    $("ul.code-topnumb > li").slice(0, 3).each(function() {
        $(this).prepend('<span class="num">' + ($(this).index() +1) + "</span>");
    });
});

Answer 4

这个怎么样？

$("ul.code-topnumb > li").each(function() {
    $(this).prepend('<span class="num">' + ($(this).index() +1) + "</span>");
});

$('.num').slice(0,3).css('background-color', 'red');

如何添加三个开始一个独特的类？

4 个答案: