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各自一箇中運行此）