jQuery的：清单元素数对元素的总数

Question

让我们来看看下面的代码：

<ul> 
    <li>What is jQuery?</li> 
    <li>What is HTML?</li> 
    <li>What is CSS</li> 
</ul> 

我希望能够做的是回答每个问题之后追加（进入另一个DIV）这种文本：问题1/3，问题2/3和问题3/3 ...

我知道length()计算匹配元素的总数，以便给我数字“3”后面的“/”但我如何显示当前问题的编号？我知道这是与index()有关，但我不确定如何做到这一点。

谢谢！

Answer 1

我建议：

var size = $('li').length; 
$('li').each(function(i){ 
    $('<div />', {'text' : 'Question ' + (i+1) + '/' + size}).appendTo(this); 
}); 

JS Fiddle demo。

Answer 2

演示：http://jsfiddle.net/tGLQk/1

使用each

HTML

<ul> 
    <li>What is jQuery?</li> 
    <li>What is HTML?</li> 
    <li>What is CSS</li> 
</ul> 

JS

var count = $("ul li").length; 
$("ul li").each(function(key,val){ 
this.innerHTML += " " + (key+1) + "/"+count; 
}); 

Answer 3

有没有保证.each会以正确的顺序，但你可以做到这一点与CSS。看到这个捣鼓一个例子：http://jsfiddle.net/NCzsG/

（注意，如果你有一个以上的列表中，你需要使用.each通过每个ul迭代的li s各自一个中运行此）