jQuery：将数字添加到有序列表中

Question

我想用jQuery来做这个：

<ol>
 <li>item a</li>
 <li>item b</li>
</ol>
<ol>
 <li>item c</li>
 <li>item d</li>
 <li>item e</li>
</ol>

......成为这个：

<ol>
 <li><span>1</span> item a</li>
 <li><span>2</span> item b</li>
</ol>
<ol>
 <li><span>1</span> item c</li>
 <li><span>2</span> item d</li>
 <li><span>3</span> item e</li>
</ol>

（This answer不适用于页面上有多个ol的情况;该数字会在ol之间增加，而不是从每个{1}开始增加{{ 1}}。）

Answer 1

或者像这样：

$('ol > li').each(function() {
    $(this).prepend("<span>" + ($(this).index() +1) + "</span>");
});

参考：prepend()，index()

Answer 2

你可以这样做（因为jQuery 1.4 +，.prepend()需要一个函数）：

​$("ol").each(function() {
    $("li", this).prepend(​​​​​​​​function(i) {
        return $("<span />", {text: i+ 1 });
     });
});​

You can see a working demo here

或者，甚至更短但效率更低：

$("ol li").prepend(function() {
   return $("<span />", {text: $(this).index() +1 });
});​

You can see that demo here

Answer 3

可能不是最好的解决方案，但它完成了工作：

​$('ol').each(function() {
    $(this).children('li').each(function(i) {
       $(this).prepend(' ' + (i+1) + ' '); 
    });
});​​

Answer 4

$("ol").each
(
    function ()
    {
        $("li", this).each
        (
            function (i)
            {
                $(this).prepend("<span>" + (i+1) + "</span>" );
            }
        );
    }
);